网页的设计毕业-论文.docVIP

网页设计的诸要素分析 静态网页设计说明书 【摘要】本论文将对个人网页设计与制作的方法、工具等展开研究和探讨。在介绍网页设计与制作语言的基础上，着重使用JavaScript作为工具语言进行网页设计与制作的实际操作，分别对基于对象的JavaScript语言、内部对象系统的使用及WEB页面信息交互——窗口和框架进行详细描述，并利用具体的实例进行验证。 【关键词】网页设计;版式设计;CSS样式布局。 【绪言】21世纪的到来，人们更深切地感受到计算机在生活和工作中的作用越来越重要，越来越来的职业需要具有计算机的应用技能。掌握计算机是职业的需要，更是事业发展的需要。网页设计与制作是计算机能力的具体表现，本章主要介绍网页设计的相关知识 一、设计概述 1.随着Internet的迅猛发展，HTML被广泛应用，上网的人们当然希望网页做得漂亮些，因此HTML排版和界面效果的局限性日益暴露出来。为了解决这个问题，人们也走了不少弯路，用了一些不好的方法，比如给HTML增加很多的属性结果将代码变得很臃肿，将文本变成图片，过多利用Table来排版，用空白的图片表示白色的空间等，直到CSS出现。CSS可算是网页设计的一个突破，它解决了网页界面排版的难题。可以这么说，HTML的Tag主要是定义网页的内容(Content)，而CSS决定这些网页内容如何显示(Layout)。 CSS的英文是Cascading Style Sheets，中文可以翻译成串联式样式表。 2.CSS按其位置可以分成三种：内嵌样式(Inline Style)；内部样式表(Internal Style Sheet)；外部样式表(External Style Sheet)三种。 ①内嵌样式(Inline Style)：Inline Style是写在Tag里面的。内嵌样式只对所在的Tag有效;例如： P style=font-size:20pt; color:red这个Style定义p/p里面的文字是20pt字体，字体颜色是红色。 ②内部样式表(Internal Style Sheet)：内部样式表是写在HTML的head/head里面的。内部样式表只对所在的网页有效。例如：HTMLHEADSTYLEtype=text/cssH1.mylayout{border-width:1;border:solid;text-align:center;color:red}/STYLE/HEADBODYH1class=mylayout 这个标题使用了Style。/H1H1这个标题没有使用Style。/H1/BODY/HTML。 ③外部样式表(External Style Sheet)：如果很多网页需要用到同样的样式(Styles)，就可以用这种方法。首先将样式(Styles)写在一个以.css为后缀的CSS文件里，然后在每个需要用到这些样式(Styles)的网页里引用这个CSS文件。使用外部(Extenal)样式表，相对于内嵌(Inline)和内部式(Internal)的，有以下优点：样式代码可以复用。一个外部CSS文件，可以被很多网页共用，便于修改。如果要修改样式，只需要修改CSS文件，而不需要修改每个网页。提高网页显示的速度。如果样式写在网页里，会降低网页显示的速度，如果网页引用一个CSS文件，这个CSS文件多半已经在缓存区(其它网页早已经引用过它)，网页显示的速度就比较快。 二、使用CSS+DIV样式布局的方法： 1.在利用CSS+DIV样式布局的过程中，比较常用到的标签有：?p/p(描述一个大段的文本或文章的时候使用)；span/span(该标签用于提于性文字)；h1 /h1、h2 /h2、h3 /h3、h4 /h4、 h5 /h5、h6 /h6、(使用于标题)，在这些标题中最带用到的有1～3。ol/ol(使用于列表描述重复出现的或者列表性的无素（使用就多）)a/a(使用于链接)img /(描述图片的，空元素，与数据有关的图片)br /(描述回车换行)等等。Borders?边框可以运用到body里的大部分HTML元素。制作一个元素的边框，你需要border-style边框样式。值可以是：?solid,?dotted,?dashed,?double,?groove,?ridge,?inset?and?outset，具体样式大家可以实际下。border-width设定宽度，通常使用pixels即单位是px，同样有四边属性：border-top-width,?border-right-width,?border-bottom-width?and?border-left-width。border-color设定边框颜色。正确使用如下例子： h2?{?border-style:?da