网页制作教案静态部分Word文档格式.docx
《网页制作教案静态部分Word文档格式.docx》由会员分享，可在线阅读，更多相关《网页制作教案静态部分Word文档格式.docx（65页珍藏版）》请在冰豆网上搜索。
图3—Internet信息服务（IIS）管理器
3.配置IIS
IIS安装后，系统自动创建了一个默认的Web站点，该站点的主目录默认为C:
\Inetpub\www.root。
用鼠标右键单击“默认Web站点”，在弹出的快捷菜单中选择“属性”，此时就可以打开站点属性设置对话框，（如图4）在该对话框中，可完成对站点的全部配置。
图4—默认Web站点属性
主目录与启用父路径
“开启父路径”是在WINDOWS2003开始的，之前的WINDOWSXP和WINDOWS2000自带的IIS是没有这个说法的，其主要作用是：
ASP页面中如果使用到include=../header.asp这样的代码，即使用"
.."
表示法来引用一个父目录，则必需“启用父路径”，../表示上级目录下的header.asp页面，是用相对路径来表示的，如果IIS设置中没有开启父路径，在WINDOWS2003服务器下正常的网站程序，在WINDOWS2003下，访问时就会报错“HTTP500-内部服务器错误”。
允许相对于当前目录的路径（使用../表示），../表示源文件所在目录的上一级目录，../../表示源文件所在目录的上上级目录，以此类推。
这样，可能会造成潜在的安全风险，因为包含路径可以访问应和程序根目录外的重要或机密文件，出于安全考虑，可不开启父路径，建议路径指向的时候写绝对路径，即完整地址。
单击“主目录”标签，切换到主目录设置页面，（如图5）该页面可实现对主目录（默认主目录为C:
\Inetpub\www.root）的更改或设置。
注意检查启用父路径选项是否勾选，如未勾选将对以后的程序运行有部分影响。
（如图6），主目录—配置---选项。
图5—默认Web站点主目录设置
图6—默认Web站点启用父路径设置
设置主页文档
单击“文档”标签，可切换到对主页文档的设置页面，（如图7）主页文档是在浏览器中键入网站域名，而未制定所要访问的网页文件时，系统默认访问的页面文件。
常见的主页文件名有index.htm、index.html、index.asp、index.php、index.jap、default.htm、default.html、default.asp等
IIS默认的主页文档只有default.htm和default.asp，根据需要，利用“添加”和“删除”按钮，可为站点设置所能解析的主页文档。
启动与停止IIS服务
在Internet信息服务的工具栏中提供有启动与停止服务的功能。
单击可启动IIS服务器；
单击则停止IIS服务器。
三.设置虚拟目录
一般说来，Internet站点的内容都应当维持在一个单独的目录结构内，以免引起访问请求混乱的问题。
特殊情况下，网络管理人员可能因为某种需要而使用除实际站点目录（即主目录）以外的其他目录，或者使用其他计算机上的目录，来让Internet用户作为站点访问。
这时，就可以使用虚拟目录，即将想使用的目录设为虚拟目录，而让用户访问。
处理虚拟目录时，IIS把它作为主目录的一个子目录来对待；
而对于Internet上的用户来说，访问时并感觉不到虚拟目录与站点中其他任何目录之间有什么区别，可以像访问其他目录一样来访问这一虚拟目录。
设置虚拟目录时必须指定它的位置，虚拟目录可以存在于本地服务器上，也可以存在于远程服务器上。
多数情况下虚拟目录都存在于远程服务器上，此时，用户访问这一虚拟目录时，IIS服务器将充当一个代理的角色，它将通过与远程计算机联系并检索用户所请求的文件来实现信息服务支持。
1.从“控制面板”里打开“管理工具”
2.从中选择“Internet信息服务”
3.在弹出的窗口中右击“默认网站”，选择“新建—>
虚拟目录”
4.弹出"
虚拟目录创建向导"
5.填写别名，如myasp或c等
6.再下一步，在“目录”区：
浏览到E:
\myasp即可（这里应是IIS非主目录下的网页所在的实际路径）
注：
5和6中的myasp不是同一个东西，5中的myasp是我们自已取的名字，而6中的myasp是一个文件夹，所有的网页内容都放在其中。
7.访问的权限一定要把所有的权限都打勾
8.点击“完成”
9.启动IE浏览器在地址栏输入http:
//127.0.0.1/myasp点“转到”按钮，就可打开主页了
四.Dreamweaver8.0本地站点的搭建与管理
要制作一个能够被大家浏览的网站，首先需要在本地磁盘上制作这个网站，然后把这个网站传到互联网的web服务器上。
放置在本地磁盘上的网站被称为本地站点，位于互联网web服务器里的网站被称为远程站点。
Dreamweaver8提供了对本地站点和远程站点强大的管理功能。
1、规划站点结构
网站是多个网页的集合，其包括一个首页和若干个分页，这种集合不是简单的集合。
为了达到最佳效果，在创建任何Web站点页面之前，要对站点的结构进行设计和规划。
决定要创建多少页，每页上显示什么内容，页面布局的外观以及各页是如何互相连接起来的。
我们可以通过把文件分门别类的放置在各自的文件夹里，使网站的结构清晰明了，便于管理和查找。
2、创建站点
在Dreamweave8中可以有效的建立并管理多个站点。
搭建站点可以有两种方法，一是利用向导完成，二是利用高级设定来完成。
（1）选择菜单栏——站点——管理站点，出现“管理站点”对话框。
点击“新建”按钮，选择弹出菜单中的“站点”项。
在打开的窗口上方有“基本”和“高级”两个标签，可以在站点向导和高级设置之间切换。
下面选择“基本”标签用向导的创建。
在文本框中，输入一个站点名字以在Dreamweaver8.0中标识该站点。
这个名字可以是任何你需要的名字（可以是汉字）。
单击“下一步”。
出现向导的下一个界面，询问是否要使用服务器技术。
建立静态页面，选择“否”。
建立动态页面选择“是”。
点下一步，在文档框设置本地站点文件夹的地址，与服务器程序“主目录”位置相同。
点下一步，进入站点定义，在站点建设完成后在与FTP链接，这里选择“无”。
单击“完成”按钮，结束“站点定义“对话框的设置。
单击“完成”按钮，文件面板显示出刚才建立的站点。
到此，我们完成了站点的创建。
3、搭建站点结构
站点是文件与文件夹的集合，下面我们根据前面对xmweb网站的设计，来新建xmweb站点要设置的文件夹和文件。
新建文件夹，在文件面板的站点根目录下单击鼠标右键，从弹出菜单中选择“新建文件夹”项，然后给文件夹命名。
这里我们创建新建8个文件夹，分别命名为：
img、med、swf、txt、css、js、moan和fy。
创建页面，在文件面板的站点根目录下单击鼠标右键，从弹出菜单中选择“新建文件”项，然后给文件命名。
首先要添加首页，把首页命名为IIS中默认的文档，一般为index.html，再分别新建01.html、02.html、03.html、04.html和05.html……等页面。
4、文件与文件夹的管理
对建立的文件和文件夹，可以进行移动、复制、重命名和删除等基本的管理操作。
单击鼠标左键选中需要管理的文件或文件夹，然后单击鼠标右键，再弹出菜单中选“编辑”项，即可进行相关操作。
内容二HTML基础
HTML是WWW的描述语言，1988年由ISO（InternationalStandardizationOrganization）国际标准化组织批准的SGML（StandardGeneralizedMarkupLanguage）标准通用标记语言（为电子文档交换制订标准，即为标题、段标题、段落和代码示例等规定起始位置和结束位置）是HTML的基础，其设计目的是为了能把存放在一台电脑中的文本或图形与另一台电脑中的文本或图形方便地联系在一起，形成有机的整体，人们不用考虑具体信息是在当前电脑上还是在网络的其它电脑上。
我们只需使用鼠标在某一文档中某处点击，Internet就会马上转到与该点相关的内容上去，而这些信息可能存放在网络的另一台电脑中。
这个过程是通过一种称为超链接的技术实现的；
另外，HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字、图形、动画、声音、表格、链接等；
再加上下面马上要介绍的概念“标记”，同学们就知道了HTML全称叫法了，即HTML（HyperTextMark-upLanguage）超文本标记语言。
我们在学习一种语言时需要学习该语言的规则，即语法，否则其语句将没有任何意义。
即然HTML是一种语言，那它与任何其他语言一样，也有自己的语法规则。
W3C通过不断完善HTML规范，于是在1998年1月XML（ExtensibleMarkupLanguage，可扩展标记语言）被批准诞生了。
XML允许用户定义自己的标记（灵活性）、允许用户在网页外部定义变量，使得XML更像一种编程语言（功能强大）。
当然，灵活性带来的是负担，必须在文档类型定义（DTD，documenttypedeclaration）中准确定义每一个标记。
功能强大带来的是复杂性，一般的Web开发人员还没有足够的能力来编写这样的程序，因为目前还没有一种编程语言与HTML相似。
XHTML是一个XML的应用，是在XML的基础上添加一个特殊的文档类型定义（DTD），是HTML的一个比较严格的执行（在HTML中可以不管某些错误，浏览器会更正其中的大多数错误，但这已不适用于XHTML了），它没有比HTML多增加任何新标记，却有可扩展性和可移植性两个特殊性质。
HTML4.01是HTML的最终版本，XHTML1.0是HTML4.01的后续版本。
一．HTML文档的结构
先看两个例子：
<
!
DOCTYPEHTMLPUBLIC"
-//W3C//DTDHTML4-01Frameset//EN"
"
http:
//www.w3.org/TR/HTML4/frameset.dtd"
>
HTML>
HEAD>
metahttp-equiv="
Content-Language"
content="
zh-cn"
Content-Type"
text/html;
charset=gb2312"
TITLE>
我的第一个HTML文档<
/TITLE>
/HEAD>
BODY>
网页中要显示的内容放置在这里！
！
/BODY>
/HTML>
或在Dreamweavercs4k
DOCTYPEhtmlPUBLIC"
-//W3C//DTDXHTML1.0Transitional//EN"
//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
htmlxmlns="
//www.w3.org/1999/xhtml"
head>
charset=utf-8"
/>
title>
/title>
/head>
body>
/body>
/html>
从上面两个例子可以知道一篇有效的HTML文档包括：
1.版本信息：
也被称为该文档的文档类型声明（DTD，documenttypedeclaration）。
2.文件类型<
（放在文档的开头与结尾）
3.文件头<
（描述性资料，像是「主题」）。
HEAD元素中可以包含标题和元数据（metadata）。
4.元数据：
元（即“基本”的意思）数据是关于网页信息的信息，可以告知浏览器网页的作者姓名、编制网页所使用的软件、语言、字符集、网页内容何时到期、何时刷新网页、公司名称以及联系信息等，还有，搜索引擎使用META元素来正确地指向网页。
它是一个比较独特的元素，它不是在开始标记和结束标记之间写内容，而是拥有一个CONTENT属性。
它没有结束标记，且内容在网页上是不可见的。
常用的有以下几种形式。
metaname="
Author"
content="
yourname"
expires"
Mon,23Mar201220:
00:
00EST"
refresh"
10,
Keywords"
listofkeywords"
，关键字列表是一个由逗号分隔的列表，大多数搜索引擎使用元数据中提供的关键字为网页建立索引。
注意：
某些搜索引擎对大小写字母是有区别的。
其中，http-equiv（equivalence，等值；
相等；
等价）：
超文本传输协议标题信息；
HTTP响应的标题头；
HTTP的头部协议，它回应给浏览器一些有用的信息，以帮助正确和精确地显示网页内容。
如，http-equiv=Content-Type或Content-Language表示显示字符集的设定。
4.文件主题<
（必须放在「文头」区块内），HTML文档的标题（即标题栏上显示的内容，也称作网页标题）被添加在其中。
两种主要的浏览器所支持的标题长度最多96或100个字符。
搜索引擎要使用网页标题作为网页的入口信息。
所以，在HTML中，缺少标题是一种语法错误。
同时，具有描述性的标题是很重要的。
5.文件体<
（文件本体），要添加到HTML文档中的任何内容。
HTML整个结构大致上可分为头部（Head）和主体（Body）两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。
而组成HTML语句的基本成分，包括元素、属性和实体，在其结构中还具有嵌套和注释的功能。
.元素（element）：
在HTML中，元素用来定义网页中的文档结构、文档的显示外观以及与其它文档的链接等。
在W3C（（WorldWideWebConsortium）万维网联盟。
W3C于1994年10月在麻省理工学院计算机科学实验室成立。
拥有来自全世界40个国家的400多个会员组织。
W3C组织是对网络标准制定的一个非赢利组织，像HTML、XHTML、CSS、XML的标准就是由W3C来定制））中，元素一词被用于两种情况：
一是“标记”意义的元素；
另一个指的是如“标题、段落”等表示文档结构的元素（elementofstructure）。
本节只介绍第一情况。
如HEAD、BODY、P等都称为元素、要将元素插入到文本中，需要用“<
”和“>
”将它们括起来，像这样<
、<
P>
，此时<
等也不再称为元素，而被叫做标记（tag），并称其为开始标记，而在开始标记的元素名前加上一个“/”，如<
/P>
，则称其为结束标记。
绝大多数元素都有开始标记和结束标记。
在HTML文档中，要在浏览器（主要的有Netscape公司的NetscapeNavigator和Microsoft公司的InternetExplorer两种）上显示的内容必须包含在开始标记和结束标记之间，并且在实际操作中，总是先写内容，然后再放置开始标记和结束标记。
当浏览器看到一个开始标记时（相当于给浏览器下的命令），它就会知道要怎样显示随后的文本，直到它找到一个结束标记。
有些元素可以没有结束标记，如LI和P等；
有些元素后没有要在浏览器上显示的内容。
元素可以划分为两类：
块元素，常用的有P、HTML、BODY、BLOCKQUOTE等和内联（inline）元素，常用的有B（黑体）、I（斜体）、Q（引用）和A（锚点）。
.属性（property）：
是每个元素特有的性质。
属性都有值，它们是成对出现的，属性的值总是包括在双引号之中，其写法有两种如：
align（属性）="
center"
（属性的值）或width\"
33%"
。
表示颜色的属性即可用颜色的名称（只有16种命名的颜色），如color="
黑色"
，也可用十六进制的值，如COLOR="
#000000"
至COLOR="
#FFFFFF"
来表示”（前两位表示红色的数量、其后两位表示绿色、最后两位表示蓝色，用十六进制表示时需要在数值前加#），老版本的HTML还可用十进制值RGB（0-255,0-255,0-255）来表示。
元素一般用大写字母表示，而属性——值对一般用小写字母表示。
当一个元素有多个属性时，属性之间用空格分隔。
.实体（entities）：
实体是W3C中的另一个学术名词，是指键盘上没有的一些特殊字符，如©
（版权符号）、®
（注册商标符号）以及™（商标符号）等。
同一个实体代码有三种书写方式，但都以“&
”号开始，以分号“；
”结束，如版权符号可为&
copy;
（字符方式）、&
#169;
（十进制方式）和&
xA9;
（加一个小写x的十六进制方式）。
HTML中最常用的实体是&
nbsp（不可分的空格或不间断空格）。
实体是区分大小写的。
.注释（annotation）：
在HTML中，注释以<
--开始，两个省略号后面的任何文本都是注释。
浏览器不会去读取它，直到看到-->
注释可以跨越多行。
嵌套（nesting）：
如，例中HEAD元素和BODY元素都被嵌套在HTML元素之中。
在有嵌套的HTML文档中，首先结束内层元素，然后再结束外层元素。
另外，有些元素是不能嵌套的，如链接中不能嵌套链接。
小结：
1.HTML的基本构建组件是元素、元素都有属性、属性都有值，且其值都应被双引号括起来。
2.绝大多数元素都有开始标记和结束标记。
这些标记将实际内容包在其中。
3.正确使用元素嵌套的原则是：
应该先结束内层元素，再结束外层元素。
内容三开始编写BODY部分
一.为网页不同部分添加一个明显的标题
绝大多数网页在其BODY中都包含一些标题（heading），使用heading元素的H1、H2、H3、H4、H5、H6元素为网页内容添加标题（它们分别代表1-6级标题）。
其格式顺序是<
H1>
要显示的标题内容<
/H1>
二.文本的录入和编辑
文本内容是网页的主要内容，有两种类型：
一是段落（paragraph）另一个是块引用（blockquote）。
在HTML中段落是P元素的开始标记和结束标记之间的内容。
默认有半英寸的的缩进。
块引用是网页引用了其他人的文本内容
1.换行并开始新段落
添加额外的空白空间，而不自成一个段落，即换行不成段（如果是文字，首行不会缩进）可用BR标记。
BR（breakrow）只有开始标记，没有内容和结束标记。
与换行相对应的就是防止换行，即一串串词在同一行中。
如要保证March2012不自动换行，可在March和2012之间插入一个不可打印字符不可分的空格实体，如March&
nbsp;
2012或March&
#160;
2012。
2.添加水平线
水平线能够使网页增色，常用于页面和脚注文本（footertext）之间，而且它与网页内容没有特别联系。
水平线HR（HorizontalRule）元素也只要开始标记，没有内容和结束标记。
3.创建列表
列表就是带项目符号编号内容，在HTML中存在三种类型的列表
◆带加重号列表（bulletedlist），也称为无序列表（Unorderedlist）
◆编号列表，也称为有序列表（Orderedlist）
◆自定义列表（Definitionlist）
一个无序列表由UL元素创建，列表中的每个项目由LI元素实现，如：
ULtype="
项目符号"
/*项目符号有：
disc（实心圆）circl（空心圆）square（方块）*/
LI>
项目一
项目二
项目三
/UL>
UL元素有开始标记和结束标记，之间的内容是列表的每个条目；
LI元素有开始标记，结束标记是可选的。
列表可以嵌套。
编号列表使用OL
升级会员 