《网页设计》复习大纲.docx
- 文档编号：29396012
- 上传时间：2023-07-23
- 格式：DOCX
- 页数：78
- 大小：68.52KB
《网页设计》复习大纲.docx
《《网页设计》复习大纲.docx》由会员分享，可在线阅读，更多相关《《网页设计》复习大纲.docx（78页珍藏版）》请在冰豆网上搜索。
《网页设计》复习大纲
《网页设计》复习大纲
第1章网页设计概述
1.网页的构成元素
（1）文本：
是网页的信息主体，能准确的表达信息的内容和含义。
占用的空间小，传输速率高。
（2）图像：
占用的空间大，传输速率慢。
如果使用恰当比文字更具有说服力，使网页更生动，更具表现力和吸引力。
网页中常用的图象文件格式有：
GIF、JPEG、PNG等。
（3）动画：
占用的空间比图像还大，但是“动”比“静”更具生命力，更能打动人心。
一般网站广告都以动画形式显示。
（4）超链接：
是网页的灵魂，是网络超文本体系结构的经络。
在网站内网页之间的跳转或网站之间的跳转等都是靠超链接实现的。
（5）音频：
音频是多媒体网页重要组成部分。
网页中常用的声音文件格式有：
MIDI、WAV、MP3等，可使用音频文件作为网页的背景音乐，但会影响网页的下载速度。
（6）视频：
在网页中用作视频交流或直播，使网页变得生动、真实。
常用的视频文件格式有：
RealPlayer、MPEG、AVI等。
（7）表格：
用来控制网页信息的布局方式。
可以使用表格来精确控制各种网页元素在网页中的显示位置。
（8）表单：
可以实现浏览者与站点之间的交互。
网页中的表单通常用来接收用户在客户端的输入，然后将这些信息发送到服务器端。
表单有不同功能的表单域组成。
（9）导航条：
是一组超链接，用于在站点的首页及其他重要网页中进行跳转。
一般情况下，导航条应放在网页的醒目位置。
（10）其他特殊元素：
如悬停按钮、Java特效、AxtiveX组件等，可增强网页功能，使网页更有趣。
2.网站建设流程
网站（WebSite）建设是个系统工程，其基本工作流程可分为5个阶段：
（1）网站策划：
是在制作网站前对网站进行周密的计划，明确制作网站的目的以及怎么做。
其工作主要包括：
①确定网站的主题：
网站的题材，即做一个什么类型的网站？
②确定网站的用户群：
以人为本
③确定网站的配色方案：
根据网站的整体风格来选定网站的配色。
④收集网站的素材和内容：
广泛收集、尽量全面，内容相关
⑤确定网站栏目及网站目录结构：
●栏目划分要服从并体现网站主题：
将准备好的“原材料”按一定方法分类，为其设立专门的栏目。
规划网站栏目的过程实际上就是网站内容细化的过程，一个网站栏目有可能就是一个专栏网页。
●不要将所有文件都存放在根目录下，按栏目内容建立子目录。
●每个目录下都建立独立的Images目录：
通常一个站点根目录下都默认有一个Images目录，用来存放站点中用到的图片。
设计时应为每个主栏目建立一个独立的Images目录，以方便管理。
●文件的命名要合理：
由于受Web服务器识别限制，目录文件在命名时要使用简短文件名，以英文形式为主，一律以小写形式处理。
⑥确定网页的版式设计与布局：
即确定网页首页和其他页面的结构形式。
（2）网页设计：
是实际设计网站的工作，包括如下几个步骤
①手绘草图：
按照创意和设想绘制出网站首页与子页的草图，也可以加入一些设计的风格。
②设计效果图：
将网站风格、创意设计和网站内容整合在一起的过程，就是根据草图在图像处理软件Photoshop或Fireworks中进行图像编辑处理
（3）网页制作：
是实际的网站构建过程，是将设计的结果呈现给用户。
选择一个网页编辑软件如Dreamweaver或FrontPage等，制作前面规划的网页内容。
如果需要，用PhotoShop、Flash、Fireworks等图形软件设计网页的背景、标题和动画等。
（4）网站测试与发布：
主要检测各个网页及组件能否正确运行，测试无误后，将自己的网站上传到指定的主机服务器上。
（5）网站宣传与维护：
采取注册搜索引擎、交换链接、发送邮件等方式进行网站宣传推广工作，并负起维护与更新的责任，以吸引更多的浏览者。
3.HTML代码结构
HTML标记是由用尖括号括起来的标记符号（也称标签）组成，即标签封闭在小于尖括号（<）和大于尖括号（>）内。
带有斜杠（/）的标签用来创建封闭标签，表示该标记说明结束。
大多数标记符必须成对使用，以表示作用的起始和结束。
大多数Web页面都具有至少3种基本元素：
根（通常是）、头部和主体。
根元素包含Web页面的所有代码和内容，用于声明浏览器、任何浏览器应用程序以及期望在页面内包含什么类型的代码元素。
元素存放用于执行至关重要的后台任务的代码，包括样式、连接及其他信息。元素存放所有的可见内容，如文本、表格、图像和影片等。说明：
（1）和标记该文档为Web文档，Web文档的所有内容都位于这两个标记之间。
（2）
和中包含一些与Web有关的特定信息，如网页的标题、样式定义（如CSS）及脚本等。常用的有标题标记符
（3）
和指定HTML文件的主体，文字、图形、图像、链接、动画、色彩和音效等元素都位于该标记符内。（4）以上标记符都必须成对出现。
4.HTML文档创建的方法
（1）直接在文字编辑软件中编写html代码，如记事本、写字版、Word等，存为纯文档格式，扩展名为*.htm或*.html。
（2）利用网页制作工具如Dreamweaver或FrontPage等的所见即所得功能制作好网页，其html代码自动生成。
这种方法对用户来讲较简单。
还可以再对html代码进行修改，比较常用。
第2章XHTML和CSS基础
1.XHTML文档的基本结构
（1）
DOCTYPE‥>文档类型声明
DocumentType的简写，用来说明页面所使用的XHTML的版本，只有确定了一个正确的文档类型，才能决定页面中可以使用哪些元素和属性，以及级联样式能否实现。
在XHTML1.0中有3种文档类型定义声明DTD可以选择。
1过度的DTD：
transitional
是一种要求不很严格的DTD，允许在页面中使用HTML4.01的标识，其写法如下：
DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http:
//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
②严格的DTD：
strict
是一种要求严格的DTD，不允许在页面中使用任何表现层的标识和属性，如
等。
其写法如下：
DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN""http:
//www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
③框架的DTD：
frameset
是一种专门针对框架页面所使用的DTD，当页面中包含有框架元素时，就要采用这种DTD。
其写法如下：
DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Frameset//EN""http:
//www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
（2）标签和名字空间
其语法结构如下：
文档内容部分。
是XHML文档中必须使用的标签，所有的文档内容（包括文档头部内容和文档主体内容）都要包含在标签中，一个XHTML文档总是以开始，以结束，两者成对出现，缺一不可。
名字空间是标签的一个属性，用xmlns表示，用来定义识别页面标签的网址，写在标签起始标签里面，其在页面中的代码如下：
//www.w3.org/1999/xhtml"> （3）网页头部标签
其语法结构如下：
头部内容部分622848*********2818在头部内容部分包含了以下标签：
●
其作用是指定了当前文档所使用的字符编码为utf-8。
●
●
●
●
（4）页面主体标签
标签是用于定义页面所要显示的内容，可以包含所有页面元素。其语法结构如下：
页面主体。标签是XHTML文件的主体标记，绝大多数XTHML内容都放置在该区域里面，通常它在标记之后，在标记前。一个完整的XHTML页面必须包含以上几个标签。
2.标签的书写格式
（1）封闭类型的标签
XHTML语言中的大多数标签都是封闭类型的，封闭类型的标签成对出现，在对象内容的前面以标签开始，后面在标签名称的前面加反斜杠结束，表示一个完整标签，结束对对象的控制，其表现形式如下：
<标签名称>标签内容
（2）非封闭的标签
在非封闭类型的标签中，采用在“标签名称”之后添加英文空格和“/”的格式来结束标签，标签中不能包含内容，其表现形式如下：
<标签名称/>
3.标签的属性
属性是包含在标签之中，用来定义标签的各种显示效果和触发相应行为的部分，其语法结构如下：
<标签名称属性=“属性值”>标签内容
4.XHTML语法规范
（1）区分大小写：
XHTML对大小写是敏感的，使用相同字母大写和小写定义的元素是不同的。
因此，规定所有标签的元素和属性的名字都必须使用小写；
（2）正确嵌套所有标签：
当标签进行嵌套时，必须按照打开标签的顺序进行关闭。
（3）标签必须要封闭：
所有页面标签都要有相应的结束标签。
封闭标签成对出现，而非封闭标签也要有其结束标签。
独立的标签的结束方法是在标签的右尖括号前加入一个“/”来结束标签，如果标签中还有属性，则“/”出现在所有属性的后面。
（4）属性值必须加上双引号：
包括数值。
（5）明确所有属性的值：
每个属性必须有一个值，没有值的属性必须用自己的名称作为值。
（6）特殊字符要用编码表示。
（7）推荐使用级联样式表控制外观，实现页面的结构和表现相分离。
（8）使用页面注释：
--这是一个注释--!
>，以使文档结构更加清晰。
二、CSS基础
5.CSS的基本语法
（1）CSS基本概念：
CSS是CasadingStyleSheets的缩写，译为层叠样式表，简称样式表，是用于控制网页样式并允许将样式信息与网页内容分离的一种标签性语言。
（2）CSS基本语法：
CSS样式规则由选择器和声明组成，基本语法表示如下：
选择器{属性：
属性值}或
选择器{
属性1：
属性值1；
属性2：
属性值2；
……
}
①选择器：
标识已经设置格式元素的术语。
②声明或声明块：
定义样式属性，由两部分组成，即属性和属性值，用冒号“:
”隔开，属性与属性之间用英文分号“;”隔开。
6.选择器类型
（1）标签选择器：
HTML中的所有标签都可以作为标签选择符，可对HTML标签重新定义。
一个完整的HTML页面是由很多不同的标签组成，而标签选择器，则是决定哪些标签采用相应的CSS样式。
（2）类选择器：
能够把相同的元素分类定义成不同的样式，对XHTML标签均可使用class=“”形式对类进行名称指派，定义类选择器时，在自定义类的名称前面要加上一个“.”号。
（3）ID选择器：
ID选择器可对页面内的特定元素定义单独的样式。
定义ID选择器时，要在ID名称前加上磅标记“#”符号。
对于一个网页而言，其中的每一个标签均可以使用id=“”的形式对ID属性进行名称的指派。
（4）复合内容：
两个或多个基本选择器，通过不同方式连接而成的选择器。
7.使用CSS样式表控制页面元素
CSS样式可以以多种方式灵活地应用到HTML页面中，选择方式根据对设计的不同要求来制定。
（1）行内样式表：
是所有样式中最为直接的一种，直接对HTML的标签使用style属性，然后将CSS代码直接写在其中，格式如下：
14px;color: #FF0000> 内容文字1
12px;color: #FFFF00> 内容文字2
（2）内部样式表：
内部样式表与行内样式表的相似之处在于，它也是将CSS样式编写在页面之中，不同的是，所有CSS的代码部分被集中在了同一个区域，即将CSS写在
与之间，并且用标签进行声明，位于标签之间的部分就是CSS内部样式表。（3）外部样式表：
外部样式表是使用频率最高、应用最好的一种形式，它将CSS样式代码单独编写在一个独立文件之中，该文件扩展名为.css，由网页进行调用，多个网页可以调用同一个样式文件，使得网站的整体风格保持了统一，也实现了页面框架HTML代码与美工CSS代码的完全分离。
与之间使用标签，也可以将link指定为stylesheet样式表方式，并使用href=”style.css”指明外部样式表文件的路径，这样只需要将样式表单独编写在style.css文件中，便可以使该页面应用在style.css中所定义的样式了。ref：
是Relations的缩写，指关联到一个stylesheet（样式表单）
type="text/css"：
告诉浏览器，这段标签内包含的内容是css或text。
（4）导入样式表：
在内部样式表的