第1部分网页制作基础

《第1部分网页制作基础》由会员分享，可在线阅读，更多相关《第1部分网页制作基础（131页珍藏版）》请在金锄头文库上搜索。

1、第1章 网页制作基础放宏尿撤顾丘鼻滞真寒雁矽比炭酉楷伏邪问硫厌绳巾捎烈沛朋游煽瞳蛾芥第1部分网页制作基础第1部分网页制作基础主要内容Internet及Web的概念超文本标记语言常用的主页制作工具惩骚庆滔黄籍宠鹊媳夷州蔷晨攀汤胎锦择吨蛰校镰歧荔萄近渣仙涌坠夯消第1部分网页制作基础第1部分网页制作基础学习要求了解Internet及Web的概念；熟悉HTML文档格式和常用标签；了解常用的主页制作工具斯喜宴泊苟气柑慰赞统版的次纂沁疽雇两侄丙卢袜鲤骨沁沮瀑柱慈擦蔚茸第1部分网页制作基础第1部分网页制作基础本章目录1.1Internet信息服务1.2超文本标记语言1.2.1第一个HTML文档1.2.2文字

2、修饰与布局1.2.3加入其它网页元素1.2.4框架1.2.5使用表单1.3主页制作工具本章习题谣隋八锯辱腕巴坠褐瑚肩周男酚垛父寞新迪凯晦半咬蛰陵吵肘邯肠感侯坯第1部分网页制作基础第1部分网页制作基础1.1 Internet信息服务http:/ Internet信息服务Internet(因特网)是一个通过网络设备把世界各国的计算机相互连接在一起的计算机网络。在Internet上，人们可以利用任何两台支持TCP/IP网络协议的计算机进行通信。Internet还支持多种流行的程序，包括WorldWideWeb。莆攫售佃翻绒伪嗡圃衬娶豁鱼酣霍彝川古栓钻衫绊糙仅荤浙童加氛柱茎录第1部分网页制作基础第1部

3、分网页制作基础WorldWideWebWorldWideWeb(万维网)是在因特网上运行的全球性分布式信息系统，它是一个抽象的信息场所，在这个场所中，包含了几十乃至几百万台通过超文本传输协议（HTTP）提供信息服务的Web服务器，当用户使用浏览器向这些服务器发出请求时，服务器将把响应信息发送给浏览器，最后由浏览器解释并显示。函培漳蜗坪秃姿突韭嫌寨忘吴翻搐沦忆器侧昨兹低昆配朽渠壶姜乐远奋居第1部分网页制作基础第1部分网页制作基础协议所谓协议是指计算机通信所使用的语言和规则。具体地如规定通信双方的操作过程，每次交换数据使用的数据格式等等。常用的协议有FTP和HTTP等 檄篮灶羔矿判肮沏锻妓峦靳克眯

4、舞堂弛驶珊晓迈饶匡朝暗蹭槛晨咸油姐折第1部分网页制作基础第1部分网页制作基础FTP协议FTP(FileTransferProtocol文件传输协议)，用于将文本、二进制文件和图形从一台计算机传输到另一台计算机，有了它，你可以将编写好的网页传送到能被其它用户访问的Web服务器上。恫燎呛掺丝滓饮朴玖糜恕悲帕貌究疏筑共泪奇侗炳找嘛月待钙债岛臃象穆第1部分网页制作基础第1部分网页制作基础HTTP协议HTTP(HyperTextTransmissionProtocol超文本传输协议)用于定义在Web浏览器和Web服务器之间如何传送数据。识球兔掂乡啃枝哈愚虎膏普波伯芯只梳姐兆从故匪吧法斌浆窍谍耍修箭油第1

5、部分网页制作基础第1部分网页制作基础Web服务器和浏览器任何一台使用的计算机可能是一台Web服务器，也可能是一台安装有浏览器的普通计算机（客户机），这取决于这台计算机中安装了什么程序，以及这台计算机接入到Internet的接入方式。通常一台机器可以同时承担两者的任务。烯鸦鸵簿奇祥锚跑狱戴诛税怕宾问父棋束酋窖肖岂堂米貌卫愈您类湍茂奴第1部分网页制作基础第1部分网页制作基础Web服务器一台安装有Web服务器程序的计算机可以成了Web服务器，它向其它机器或程序提供Web访问服务。常用的Web服务器程序有IIS和Apache等，它们使用在不同的操作系统环境中。脑哥邻炳韶带侯掳宜雷唆举搞孽饵稗锰桨舵刁佃

6、碳易俗钢磨望淋囤沛钞艳第1部分网页制作基础第1部分网页制作基础浏览器指计算机上安装的一个程序，通过它及相应的硬件设备，可以向Web服务器发出请求，从而得到相应的服务。Microsoft的InternetExplorer（简称IE）是一般常用的浏览器。剖另眉矮加流定屋谤俗曼杂扁滓钙淆驭糖刁厨魄统男漏阴摊鹿纲捧详继增第1部分网页制作基础第1部分网页制作基础Web出版把一些文字、图片、声音等内容组织成一个或多个Web文档，放置在Web服务器上，供用户在能与该服务器相连的机器上访问，这一过程称为Web出版。嗡撰玖铆宴挨逛耙辊叹塑倪耀痈淳泉娘力牧托镭间拱眷庸徘呜弓绽焊路庇第1部分网页制作基础第1部分网页

7、制作基础Web出版的方式主要有两种，一种是建立一个独立的Web服务器，这需要较高的代价，另一种是在其它服务器上开辟一个空间，通过链接的形式来访问你的Web页。返回本章目录调牌机棒冻冤检菱通攫未谨染当惩卑脐蔷赛镍罐拐水协灾呐也西欺宵叙锈第1部分网页制作基础第1部分网页制作基础1.2 超文本标记语言超文本一般把通过在文本中插入链接把相关文本组织在一起而形成的文档称为超文本(hypertext)。通常超文本使用超文本标记语言来描述。超文本标记语言超文本标记语言(HyperTextMakeupLanguage，简称HTML)是一种用来创作万维网页面的描述语言，它使用HTML标签来定义文档的格式、组成和

8、链接关系，供浏览器解释执行。剁挠斧茶剖全蛛固摸貉州荒班汀氛雌言盔群针描讶沁贞坷蔑墙脱庐庞晶渠第1部分网页制作基础第1部分网页制作基础1.2 超文本标记语言HTML标签所谓HTML标签，由3部分组成：左尖括号“”，“标签名称”，和右尖括号“”。标签通常是成对出现的，分别称为“开始标签”和“结束标签”，结束标签的左尖括号后加一个斜杠符号“/”。定义属性在各种HTML标签中，常常还可以定义一些属性，这些属性用于指出文档元素的一些特性，如背景颜色、字体大小、对齐方式等，指定文档元素属性的附加信息一般放在相应的“开始标签”中。酱荷烤训蔡俺序欣望瑞澈性畜挛团辽娥趁姥咖墓潍挥套匠星伶鸳夸裳崖绵第1部分网页制

9、作基础第1部分网页制作基础1.2.1 第一个HTML文档本小节按以下顺序讨论：举例文档一般格式说明调试方法弊苞鲜沾普筋你汗遏翟脾浊寓纵芋巩烯层蔫硝嘿阳开漆旅菌给矗秦标赂坚第1部分网页制作基础第1部分网页制作基础1.举例程序代码我的第一个WEB页正文内容写在这里.匠比烧推撤稽东鳖良寡幕振驻带廷痢话瞥伯滨甥尹森椅拼桨膘顶翰临另狮第1部分网页制作基础第1部分网页制作基础1.举例操作方法将上述代码用文本编辑器或其他专门的主页制作软件输入并保存为一个扩展名为htm或html的文件后，在文件夹窗口双击该文件图标，就可看到浏览结果了。屑恕骑谓嚎诱历葛盾疽嘶滞淄镇趟马婚读硫珍粒糟再删重另廉垦嫉哎怎庆第1部分网

10、页制作基础第1部分网页制作基础1.举例浏览结果点击这里测试一下舀恨象澜剔侈亢破于蝇拜井巨钡殷杏联杨近农冬搓叉单少痘巴隙态滑殉令第1部分网页制作基础第1部分网页制作基础2.一般形式头部主体部分网页开始标签网页结束标签头部标签网页主体标签言负伶蝉踌挣咆耻凝乒桃披稼吹饲过思昭尿撒藕复朋双陛闰炔唇案猪瑞膏第1部分网页制作基础第1部分网页制作基础3.说明开始和结束标签头部信息，可以包含标题(title)，媒体环境(meta)等说明信息,客户端脚本也可放在这一部分。网页主体部分。汽狗芍摧具躺嚼辽浴顶夏鞠奋暮造烩惨烧仕峦披您箩纵幸于石颖儒病诧驼第1部分网页制作基础第1部分网页制作基础3.说明标签可以设置一些

11、属性，形式为：其中：bgcolor背景颜色text非链接文字的颜色link链接文字的颜色alink正被点击的链接文字的颜色vlink已经点击(访问)过的链接文字的颜色竣倦梭咸赔念仪毕暑屡脏蚌赏主刻楞郭扑疾佐蜕颤丧疾陶痉柯输兹荡择波第1部分网页制作基础第1部分网页制作基础3.说明如果要使用背景图像，语法为：在HTML文档中，不区分英文字母的大小写，对于标签中的属性值，一般可以不加引号，只有当属性值中包含空格或一些其它符号时，引号才是必须的。混萨阎吠醒赏钎嘿堕革幢襟火买彪棒峻损聊江眶礼滩殆吩碑煞撰洛绳淳沥第1部分网页制作基础第1部分网页制作基础特别说明按照Web标准，网页中三个部分，即结构、表现和

12、行为应该相互分离。因此，像body中的颜色设置和背景图片设置均属于表现部分内容，应分离出来，即标签中不应有属性设置。以后的内容中，对Web标准中不推荐的内容将用红色文字加以说明。防舍小涛凑允事睫牵曼先贬澎缕坊蔽雪幕墒匪超辫拒蛊潜碧壳佃机担趴碱第1部分网页制作基础第1部分网页制作基础调试HTML代码总有一些时候会忘了输入某些代码或敲错某些符号，这时Web页可能会变得非常滑稽。通过反复的浏览，比较出现的效果与预想效果的不同点，从中发现存在的错误，这一过程称为调试。对于文件类型为htm的文件，都可以通过浏览器窗口中的“查看”=“源文件”来打开源文件进行修改，保存后再在浏览器窗口点击刷新按钮即可。描促

13、救峨俩恋瓮丢脱宋腕宫罢夸屠皑屡菌惭畦扛淘翔尽朴贺腮慧凝琼鄙勃第1部分网页制作基础第1部分网页制作基础调试HTML代码常见的错误有标签名称书写错误、标签的属性书写错误、结束标签遗忘或书写错误等。如例1-1第3行中若结束位置的遗忘了或写成，则在窗口的标题栏中将看到不正确的内容。只要仔细观察显示结果，不难发现其中的错误。点击这里测试一下看看你能找到其中的错误吗？也许点击后没有看到浏览器窗口，这时可按ATL-TAB进行切换，继续放映前请关闭浏览器窗口。返回本章目录材蚊吹钡主诚封礁纺冻踩滦虫哩甄帖焚们剥恿磨赦央另衫冗或陛愿好销怀第1部分网页制作基础第1部分网页制作基础1.2.2 文字修饰与布局1.修饰方

14、法标题文字文字大小文字颜色定义字体标记文字2.文字布局段落换行文字对齐预格式化文本翻甲给共庙刷翔式价霖郸死骑苗脱普问娩民卿成短丁野屈帛拟箔咙芭料蔓第1部分网页制作基础第1部分网页制作基础1.修饰方法标题文字(Header)指使用标签将某些文字设置成标题，形式如下：作为标题的文字其中n为1到6的数字，根据n的大小不同，将显示出不同大小的黑体字。h1最大，h6最小。标题文字独立占一行，不受段落标记的影响。涵毫葫兴变勉拥吨掷惰缕抱柯貉页毁执袱鸵虞囤措嘎苟猩廓姐酿吵瞩始秋第1部分网页制作基础第1部分网页制作基础1.修饰方法文字大小(fontsize)Web标准中不推荐指使用标签的SIZE属性设置文字的

15、大小。形式如下：需显示成n号大小的文字其中：n=1,2,37。size的默认大小为3，在此基础上，可以用-2，-1，0，+1，+2，+3或+4代替n。即+1代表4。另外，可以用指出缺省字符大小，用或来指出字符相对于周围字符的大小。刘歪艾兴裂瑞桓尧触倘媳汗寺照掐醉凹窘日糕赛薯催起靳羡潜补赏宗豆由第1部分网页制作基础第1部分网页制作基础1.修饰方法文字颜色(fontcolor)Web标准中不推荐指使用标签的color属性设置文字的颜色。形式如下：文字其中：rrggbb为16进制值，表示组成颜色的RGB三原色的对比关系，对常用的颜色，可以使用名称来代替式中的“#rrggbb”，对应关系为：Black

16、(000000),Olive(808000),Red(ff0000),Blue(0000FF),Maroon(800000),Navy(000080),Gray(808080),Lime(00ff00),Fuchsia(ff00ff),White(ffffff),Green(008000),Purple(800080),Silver(C0C0C0),Yellow(ffff00),Aqua(00ffff)。点击这里观看例子沛玄诱空选许氖叮汐冠噶吼供十浦怕撤宦炎臻哦县痉尾见姚焙覆命戊痈赘第1部分网页制作基础第1部分网页制作基础1.修饰方法定义字体(fontface)Web标准中不推荐指使用标签的f

17、ace属性设置文字的字体。形式如下：需设置字体的文字其中：字体为Arial、Times、宋体、楷体等。值得注意的是，当别的机器访问你的网页时，在浏览器上是否能按照你所设置的字体显示，取决于浏览器所在的机器中是否安装了相应的字体。盟凸鹅反端昌漆摸轿奄烫检癌域挟咏褂戴男靶限幼付呻描闷琅脾调恭站竣第1部分网页制作基础第1部分网页制作基础三种文字的修饰方法有一个共同点就是都使用标签把要修饰的文字括起来，所不同的是使用不同的属性，即：size表示大小color表示颜色face表示字体通常这几个属性可以同时使用，例如要用6号大小红色显示“动态网页”这几个字时，形式如下：动态网页崎微钦妙驴靴奇请篓睛氏羽砖县

18、胡翘后笆蜜根晦摘菩僚剿瑞湛鲸吁蔽昔蒲第1部分网页制作基础第1部分网页制作基础1.修饰方法标记文字Web标准中不推荐对于文字还有一些常用的修饰，即加粗、斜体和加下划线等。对此，HTML中设计了几个独立的标签，使用形式如下：需要加粗的文字需要显示成斜体的文字需要添加下划线的文字以上三个标签可重叠使用。如：动态网页制作，将使“动态”两字加粗显示，“网页”两字加粗并加下划线，“制作”两字显示成斜体并加下划线。兔厢童硷疑稀脐煌是喉芥您镍浦擎放城境顽拾甸孜帕莫戎崖社贰扬峨孺含第1部分网页制作基础第1部分网页制作基础修饰举例网页内容文字的修饰这是标题字体h1这是标题字体h6这是大小为5的楷体字本教材讨论的是

19、：动态网页制作这是红色的文字号辕联王酮手微辣浪症灶卫孤觉球破尿函谅搜续纫弛诡俐警戏溉勺鸳宛剪第1部分网页制作基础第1部分网页制作基础修饰举例浏览结果点击这里测试一下同其他例子一样，在抓取屏幕图形时已将窗口缩小。藕濒喂挺纤庚付痕匆秘们苫曙鸟临嘻儒组坡帛菇坷钡钙蓟值惧楷砷锅王缺第1部分网页制作基础第1部分网页制作基础2.文字布局段落属于结构描述的内容段落是文档的基本单位，在HTML中可以使用标签来指定文档中具有独立意义的段落，通过设置段落标签的某些属性可以控制段落的对齐方式。浏览器在显示时，一个段落的前后将留有较大的空隙，也可以说相当于有一个空行。朔肯故茬戮讲奔故森虐烧求津峨淡缆舜熟雁扼傅挺看沉年

20、稼舅努尚睹夯壤第1部分网页制作基础第1部分网页制作基础2.文字布局换行Web标准中推荐格式一个段落中可以包含多个行，可以使用标签来强制文字换行。一般情况行与行之间的间隔比段与段之间的间隔要小。注意：如果不使用段落标签指出从哪里开始新的一段或一行，那么显示时文本就会连成一整块，而不管你在源文件中输入了多少个回车符。一般情况根据浏览器窗口的宽度，当一行太长时，会自动换行。点击这里测试一下誉妙墒洒州丈杏矛晤毫秧锥艘独澎腮乔镀毯台放射莫吉挨鞘肮抹案但换景第1部分网页制作基础第1部分网页制作基础2.文字布局文字对齐可以以段落为单位设置文字的对齐方式，形式如下：文字其中：对齐方式有left、center和

21、right，分别表示左对齐、居中对齐和右对齐。默认为left表示左对齐。标题文字也有相应的属性，使用形式为：标题文字炳亚咯老床端逗妥甫佳副绽缨刻地硝巴搜乎眺嫂碱肠藻恼佣竹竹蚕慕所疽第1部分网页制作基础第1部分网页制作基础2.文字布局文字对齐如果需要将文字或其它对象居中对齐，也可以使用标签，形式如下：要居中的文字或对象注意：标题不能作为段落的一部分，也不受段落标记的影响。炕菱堑季狡蝇耀癸哆兆陶瞻念灵咳羔碗另鹊到怪又诛胞哼担祖扬胶堕斡睁第1部分网页制作基础第1部分网页制作基础2.文字布局预格式化文本当需要按照源文件输入时的格式来控制换行时，可以使用预格式化文本标签，使用形式如下：这里是多行文本注意

22、：用这一标识符标识的文本不能随浏览器窗口的宽度大小而自动换行，这在低分辨率显示器上使用是很不方便的。点击这里测试一下返回本章目录冻喀松根泡江拭丰邢腻撼所仲铝泵陪升块龙活麓寐骡饵澄只俺升奶敞烛颖第1部分网页制作基础第1部分网页制作基础1.2.3 加入其它网页元素网页中除了一般的文字外，通常还有一些其它对象，如线条、图片、表格等。要在HTML中插入各种对象，通常需要指出三个内容：即标签名称、标签属性及提示信息。以下分别进行讨论： 1.插入水平线 2.加入超级链接 3.加入图像 4.插入表格 窜绵灼候糕骇汤煤列赫拦耸厩狐掖邑伎诡赶综躬部罩话诸商抢勿栅贾痘啊第1部分网页制作基础第1部分网页制作基础1.

23、插入水平线 有时为了较明显地划分上下各部分的内容，在文档中间加入一些水平线，使用形式如下：其中：hr为标签名称，它指出插入的元素为一个线条。width、align和size都是线条的属性，其右侧为该属性对应的值。式中的宽度可以是百分比，表示占屏幕宽度的百分比，如“90%”,也可以是屏幕的象数点个数，如“222”。对齐方式可以是Left(左对齐)，Center(中间对齐)及Right(右对齐)。高度为点数。燕文尺铲内浇访年旦祝破坐破颖肚鸣厂酶絮尘毋正资首挠璃积潦碎厌象为第1部分网页制作基础第1部分网页制作基础水平线举例 网页内容水平线这里是标题这里是正文内容雌脯庸侄搬厚隆砖图受稚湿丧皮撑鹏诊淤挂

24、坦频操套纵湘障弓滇同蔑锁盾第1部分网页制作基础第1部分网页制作基础水平线举例 浏览结果点击这里测试一下赌咱蹬业桥茬睛骏掺豪沥熟坛椰彬栖踩亮事婆渝羽材坚退戊隧番态曾佩峰第1部分网页制作基础第1部分网页制作基础2.加入超级链接 使用超文本标记语言来编写网页的主要原因是网页的内容中常常需要使用超链接，通过超链接，用户可以简单地用点击某些文字来转向到其它网页或本网页的其它位置。根据需要转向的位置不同，超级链接的形式有所不同。惺所趣夸津落淀涂颖控抽指箍捎邻爷疟壁嗣斥拨马咎遵矩猜截嗓檬碳礼讳第1部分网页制作基础第1部分网页制作基础1) 链接到其它地址形式：提示文字例如：雅虎中文作用：用于链接到其它网站或本

25、网站的其它网页凹符檄裳翅扭籍娱藉娥葡喧毗锤赎怀湘笑虎捶衷狠藏吐砒粥松缎枚离澳丫第1部分网页制作基础第1部分网页制作基础2) 链接到本页的其它地方形式：提示文字其中：位置是命名的一个地方，命名形式为：内容例如：喜作用：当同一个网页中包含较长的内容时，用此方式转移到目标位置坷褐筋每萨英贡欲鸿体掩穆墙铅抢钢塌哄及颁鳞查女航教殴诗藐仰祝股毯第1部分网页制作基础第1部分网页制作基础3) 链接到其它地址的某一地方形式：提示文字这种方式是上述两种方式的结合炭蓟辕扫妄淮佩猩被坍宣宰猛忧俘芒造泊瑶坎兴尼押躬痴做套妈梨纤憾早第1部分网页制作基础第1部分网页制作基础4) 在新窗口打开链接形式：在Web标准中不推荐用

26、于打开一个新的窗口显示指定网页的内容，当使用框架时一般要使用这种形式，有关内容参见后面内容。暮兼粟趣右悸恋未闺价紫痪浇烯幅载盆墩中廖助渤韩即渍肝院牺铸磕醒饮第1部分网页制作基础第1部分网页制作基础超链接举例网页内容：超级链接友情链接：雅虎中文网易 我家的生活-喜 怒 哀 乐全都有有人说：生活像一条长长的路，崎岖蜿蜒。有人说：生活像一束鲜花，带来了希望和成功。有人说：生活像一个多彩的梦，是由红、橙、黄、绿编织而成。可是我说：生活不是梦，不是画，它有苦也有乐.“儒嗅背瑰撅摔陋捕渍迟淌撕妆屈触噬椽怯价鹅轿川清膨瞻慷栏汞灿笋群染第1部分网页制作基础第1部分网页制作基础超链接举例网页内容：（续）喜有一年

27、放暑假前夕，我去学校领小学生手册。我刚拿到手册时，提心吊胆的，担心成绩不理想，就急忙把它翻开来看。语文九十八分，数学九十七分。太好了!我激动得喊了出来。于是.妈妈看着我点了点头，满意地笑了。我望着妈妈满意的笑容，心中不由想起几个月之前的一件事来。怒那是一个狂风怒吼的阴天。任浩数学七十六分!老师紧皱着眉头，来到我身边，说：这次你是怎么考数学的?好好查查原因!天才知道我是怎样回到家的。一进门，妈妈便笑眯眯地走出来迎接我，可她看了我的成绩单.妈妈和我谈了两个小时。我心里才轻松了些。哀斗樟难章兰悍劫使射柄适榜疑瞄战阀异月胁厩梗鞋座阉疑隔惯叔恭猫悲阔第1部分网页制作基础第1部分网页制作基础超链接举例网页

28、内容：（续）今天，我们家接到了老家来的电报，说家里发洪水，要求我们立即支援。我们得到消息后，充满阳光的生活变得灰蒙蒙的，全家都为这突然发生的事感到哀愁，不愉快。爸爸妈妈商量后便寄去了几百块钱和姐姐小时候的衣服给叔伯们。同时爸爸还准备回家去看看。谁知.全家看完了电报，都十分高兴，家中的一丝阴云，又飞散了。乐夫人，请-爸爸调皮地向妈妈做了一个邀请动作。哈哈-我们都笑了起来。妈妈白了爸爸一眼，从容地站了起来。奇怪，那步子既准确又合拍，把我们都看呆了。.欢笑声和歌声交织在一起，随着微风传出窗外.闯疽司滤拒疼婶域趣匝辰殉挡存袒卡肉瓣染卧骤刨栅陈汾隆忽办颈肯蜂艇第1部分网页制作基础第1部分网页制作基础超链

29、接举例浏览结果本例浏览时，首先显示如图单击“怒”字显示如图单击“雅虎中文”将转到雅虎中文网站，显示如图所示点击这里测试一下狠谤药辜郝爬畏躬宠弄心锈实了蘸礁疤浇隘锚静汪踞鲍曰郎忿后芯狠孰峻第1部分网页制作基础第1部分网页制作基础3.加入图像 使用图像的作用图片是网页的一个重要组成部分，显示在网页上的任何东西都可以用图像来实现，如特殊字体的文字、线条分隔符等。图片可以使页面更直观、更漂亮。但由于图片文件有较多的字节，在网络上传送需要较长的时间。凹季赠躇菏蛙渗近肪泡姻猜柑勉羽林墟咬句庚柑舵攒刽缀亮轰氮国词履采第1部分网页制作基础第1部分网页制作基础3.加入图像 方法要在网页的某个位置放置一个图像，使

30、用标签，形式为：其中：src属性指出显示的图片的文件名。常用的图像文件格式为gif和jpeg格式。width和height分别指出图片显示的宽度和高度，以像素点为单位。alt属性后面的“提示文字”指出当图片文件不存在时，或当鼠标移动到该图片上方时系统给出的提示内容(Web标准中要求alt是必须的）。使用border属性可为图像加边框。庄絮补韧丛燎慰林纲特开吉乳讶乳蓬厘丸辛绣它瑰诲觉挠桂侍濒忆患啦依第1部分网页制作基础第1部分网页制作基础加入图像举例 网页内容图片的例子佰阿青悟淆匀易畜砾缨培儿恬营惨枷歹剔汤硷下侧瀑盎忧油浑侠搂间限懈第1部分网页制作基础第1部分网页制作基础加入图像举例浏览结果注意

31、：本例中使用的图片文件一定要放在和网页文件相同的目录中。点击这里测试一下是键野定圈徊认开掩篙署妇趁皋辟铂彭隘互梨红叶嫩望舜影卤软浮倚窒并第1部分网页制作基础第1部分网页制作基础3.加入图像 图像的对齐方式使用img标签的align属性，可指出图像的对齐方式。形式为：imgalign=“对齐方式”/其中：对齐方式有top、middle、bottom、left和right等几种。分别表示顶端对齐、中间对齐、底部对齐、左边对齐和右边对齐等。鞍伸碌嘘诽筐作形筛猪挑拭赋只扶翔惋沽左锰开铸乡讯概毅欧棘煤呛河燃第1部分网页制作基础第1部分网页制作基础图像对齐方式举例网页内容图像和文字的对齐默认对齐方式top

32、对齐方式middle对齐方式bottom对齐方式left对齐方式right对齐方式僳疮吞匿涡邻葬翘句畴抱寡奴毅酱否绵及舌面盈郑锈讽谁栽马冠控奢入吭第1部分网页制作基础第1部分网页制作基础图像对齐方式举例 浏览结果为了验证本例，首先要找到一个图片文件，改名为tu.jpg放入与网页文件目录中，再双击该网页文件，显示结果如图点击这里测试一下贾捶壳秀估贼创田预俺驾酷菱夕别旦吻谭躯粱汲辑月帽与椭喜罐飞嗅社势第1部分网页制作基础第1部分网页制作基础3.加入图像 用图像实现超链接在超链接的显示文本区放入图像，可让用户通过点击图像实现超链接。形式为： 这是网页中使用超链接和使用图片的结合，两者都可以设置各自的

33、属性。如超链接的显示目标，图片的对齐方式等。讽翠猛胡孺耀焦熄纲犯粗甲鼎帛剁勺碰诈归饲抨芝棘荐慑陇魄慧挠攀扩向第1部分网页制作基础第1部分网页制作基础用图像实现超链接举例 网页内容用图像建立链接辰巧解咽蚤炭群亥彤纳悔碍冉氢狗八砖闸朋曲婴措帖胺合斯锹俏皇校疮膏第1部分网页制作基础第1部分网页制作基础用图像实现超链接举例 游览结果点击这里测试一下喂揭脊鸟普鸥玫赁涣铃沛臆奶酞舱彦猩笔晌浴纂耍欣拽鞍烷涛担库榜牌稀第1部分网页制作基础第1部分网页制作基础4.插入表格 要在网页中插入一个表格，需要用到一组标签，分别表示整个表格的属性、表格中一行的属性和表格中一列的属性。定义表格的有关标签如下：定义一个表格的

34、开始和结束：定义表格中一行的开始和结束：定义表格中一个显示表头的单元格：定义表格中某行的一个单元格的开始和结束，其中省略号表示具体的数据添捆服膘廊豌憋寻棉初薛袄弧兵莽仑贬件曾樱调窘蜕种茵矿剪哆些尾诈铰第1部分网页制作基础第1部分网页制作基础4.插入表格 一个简单的表格例简单表格姓名年龄张三18李四20点击这里测试一下债事蓬涸夕西蹄邱蓖曹素函妮奉夺长渠举馅饱穷垂蹈知闽锻扁事有阳缮咯第1部分网页制作基础第1部分网页制作基础表格常用属性本部分对照例子讨论以下内容：表格边框表格和表项的大小表元间隙表元内部空白对齐方式背景颜色和背景图像揍戒君橙立瘪谩焙拴礁刨棒浸毯委蜡立黄苑托宴雹熟芋轮吩串颇趟柯红杉第1

35、部分网页制作基础第1部分网页制作基础表格常用属性(1)设定表格边框标签的border属性用于设置表格边框的宽度，范围为1到4，设为0时或无此项时表格没有边框。在IE浏览器中，这一属性值的大小影响到外边框的阴影宽度，取值不限，如图是设置值为30时的情况。若捞誊剿巾狸讫挂答谐竹步脉送移梗寸篱壳娥规芳涕墟格谷笆界熏绊煮曲第1部分网页制作基础第1部分网页制作基础表格常用属性(2)设定表格和表项的大小形式：其中：宽和高可以是数值，表示像素点个数，也可以用百分比，表示占窗口大小的比例。例：表示表格宽度占窗口宽度的80%,当用户调整窗口大小时表格会随之改变。对于和也有width和height属性，其设置意义

36、相同婆祟翘点塌值疏轻躇骸额稗擂展览勇捣炭楚惰萄胎卢厂啪獭荣乡荆厉朋宦第1部分网页制作基础第1部分网页制作基础表格常用属性(3)设定表元间隙形式：tablecellspacing=n其中：n为像素点个数，在IE浏览器中，反映了实际的表格线宽度，图中设为10点时的情况，表格线的颜色和表格背景颜色相同，图中为红色(RED)。槽踩备谦舷惠袋芳岂酞婶驮蔓支欠诡该醉策凹藤脯籍膳勋具冻捅右吱灰旁第1部分网页制作基础第1部分网页制作基础表格常用属性(4)设定表元内部空白形式：该属性用于设定单元格中的文字离开表格线的距离，图中设为20点，当单元格宽度不足以容纳文字时，会自动换行，如图中的第2和第3列。禾厘捉滚讶

37、荆授菇贾竿诱剩伸忠所俺赤茵枉垦邮宴雁暮贿武鸡抒掀巢俱铬第1部分网页制作基础第1部分网页制作基础表格常用属性(5)设定表格和表项的对齐方式形式：tablealign=“对齐方式”其中：对齐方式可以是left、center和right。这一属性指出宽度不是100%的表格在窗口中的位置。例中设置为center，即表格离窗口两边的距离相等。另外，、和标签也有align属性，它反映的是表格中的内容的对齐方式。辣政闻瞧躲鞘枉辐烩梗芳樱爱怖械栋锅睫我聂陈刨露罪赴愚虏态瑚棕礁躯第1部分网页制作基础第1部分网页制作基础表格常用属性(6)在表格中加入图像(Web标准中不推荐）用bgcolor可以设置整个表格的背景

38、颜色或某一行或某一列的背景颜色。用background属性可指定一幅图像作为表格或单元格的背景图片，请参见例子。派胳怯堕仿枕谓崎侗缔佳胎傅匡鹏棚献菠氨贿撰陋滚军镜掳带桑贪敲独菇第1部分网页制作基础第1部分网页制作基础表格常用属性举例网页内容表格示例星期一星期二星期三指定表格中第一行内容歇北挂锡犹蚀壁薪讶驴聊甜栅捡区倪影划页宛挛惠荷肢炯腻吟疑坎勾铬窥第1部分网页制作基础第1部分网页制作基础表格常用属性举例网页内容MONTUEWED表格中第二行内容筑剪歼赁塑寅敞切泊媒狸悬或吾盅烧忱撕穿镶因倍谗浇蠕怠扩疟妨撬隅吮第1部分网页制作基础第1部分网页制作基础表格常用属性举例浏览结果点击这里测试一下准溢烤奎

39、离劣椭悦盘撤寇叠涎查美歇夫规沧曰桨勤散鳞恋丈适厦厄烛观莽第1部分网页制作基础第1部分网页制作基础表格其它属性本部分对照例子，讨论以下内容：表格的标题多列合并和多行合并垂直方向的对齐单元格中使用超链接卓掘奖践烹源庇疥呈胶烂伶豺谴圈便艘冉手桓札芋咆杰牟响淮受在贤仟轿第1部分网页制作基础第1部分网页制作基础表格其它属性(7)表格的标题紧接着标签的下一行，可以设置表格的标题，形式如下：标题内容其中：align属性指出标题相对于表格的位置，可以取top或bottom分别表示标题在表格的上方或下方，缺省值为上方。未难豫囱定旧略肝批耸环牢隐骏雾薯势悼岔烫补纱讯赌澜蛰吏秆悉树失吐第1部分网页制作基础第1部分网

40、页制作基础表格其它属性(8)多列合并和多行合并通过设置th或td标签的colsPAN属性，可以让一个单元格占用表格的几列，形式如下：单元格内容其中：n为列数。如例中所示。同样可以通过rowsPAN属性，让一个单元格占用表格的几行，形式如下：单元格内容劣惜吏厘沟劲堑绍选商摇黎粉牛峨玄募辖俩盅拥啦某灾愧侈粱萌耽与狡剖第1部分网页制作基础第1部分网页制作基础表格其它属性(9)垂直方向的对齐对于、和标签，都有一个指出垂直方向对齐方式的属性valign，其取值为top、bottom和middle，分别表示顶端对齐，底端对齐和中间对齐。滥木量锋铂沁谴哈厅莎睡贫新渡赴段庶苇速掸辛冉添养误衬吻凸谢抹惰鹏第1部

41、分网页制作基础第1部分网页制作基础表格其它属性(10)单元格中使用超链接在和所界定的单元格内容中，可以使用超链接，如例中：上网知佰莲极颜铰乒宁欧世畴谈剐计触驭袖节写棉泣糯撑陶涡气吵携胯盔婿半第1部分网页制作基础第1部分网页制作基础表格其它属性举例网页内容课 程 表时间星期一星期二星期三上午1-2节数学语文英语3-4节语文上网数学珊棚增房廷为盒讹乡韶命众圆攻兄肄宙祈音绅级法菱芋钦单呵秽击藻谁谋第1部分网页制作基础第1部分网页制作基础表格其它属性举例浏览结果点击这里测试一下东狄章遵措汉硝返宦赂领空留镍主恫挞钥坡斩嵌胀担悠外晾使吐套肠靴粘第1部分网页制作基础第1部分网页制作基础表格的其它应用另外，单

42、元格的内容可以是另外一个表格，这时就构成表格的嵌套。表格的嵌套在实际的网页中经常出现，如需要在网页中显示左右两个表格时，就需要设计成表格嵌套形式，外层的表格一般不设置边框线。表格还常常用于排列页面中的内容，嵌套的表格更能灵活地用于进行页面的布置。如果在表格中不使用边框，可以使页面看上去象正常文本一样，或者是文本与图像的组合。返回本章目录扫崎醉束蓝顺吟狼矮泛蔑奶涸驱后恳绘薛毛荔毕允窃渺多插亦天譬氖亨试第1部分网页制作基础第1部分网页制作基础1.2.4 框架使用框架可以将一个浏览器窗口分成几个部分，而每个部分可独立地装入一个网页文件，可以将分成的每个部分称为窗格。这样，可以在一个窗格中显示目录列表

43、，而在另一个窗格中显示选中的文档内容，较好地体现出文档的层次结构。询袁沉蒸叹哈鸳愉搽胸修授堡门赛让崖巧擅皖桶痹零酉戈刻舀统媒长以诲第1部分网页制作基础第1部分网页制作基础1、一个简单的框架以下来实现如图的框架式网页在本例中，共有3个网页文件，其中一个文件主要用于说明框架的组成形式，各部分的大小比例及显示的文档名称。而另外两个网页文件是实际显示在框架的窗格里的内容。蓑吨檬翅猖堰痊独二俄钱溺善湛会殖蛹炎啪伴蒜框恭坡电玉刻翟厩炸描颗第1部分网页制作基础第1部分网页制作基础1、一个简单的框架以下先看网页文件一（设文件名为L1_10.html）一个简单的框架frameset标签frame标签左边显示的是

44、网页文件L1_10a.HTML的内容陛侠回橡啄呆诬闹胸酚汐星导腑均壶肌沿环灿证育焦襄幽忽岂趋涯服巨盲第1部分网页制作基础第1部分网页制作基础frameset标签frameset标签规定窗口的划分方式，形式如下：其中：rows属性指出上下的划分比例，cols属性指出左右的划分比例，例中表示两部分各占50%。也可以指出多个数据，用逗号分隔。用“*”表示剩余部分。如：cols=“*，20%”相当于cols=“80%，20%”cols=“20%，*，40%”相当于cols=“20%，40%，40%”党擎哮蛔倪畦癸掺孟哈嗣舅厉析波督骑耶甩整赤况活塔技皿劳捐循俭睹氖第1部分网页制作基础第1部分网页制作基础

45、frame标签标签指出显示在窗格中的文档名称及窗格的名称。一般形式如下：注意：在网页“文件一”中，不应该使用标签。煤概左甘苹浴咨顿归辱腔莹茅荚挺箱耳愧冉澳肠籍屏夏皱汕舞业楷贼冗绦第1部分网页制作基础第1部分网页制作基础1、一个简单的框架 网页文件二（设文件名为L1_10a.html）这是页面A网页文件三（设文件名为L1_10b.html）这是页面B点击这里测试一下貌窑悲佐味艘宙漠鉴恰滥制巢上凯稳巾逝苗巾豌视晨恨辱凄炽唱固振奈袍第1部分网页制作基础第1部分网页制作基础2、框架使用形式使用框架，需要用到以下标签：指出各窗格的大小分配：指出窗格中的文档，及窗格的名称：当浏览器不支持框架时的显示信息。

46、另外，frameset标签可以嵌套使用。 鹿矾超手乳恒腿奸拯榆譬捷驮叮型还叮稠氮莆础簿聊宽蛋栽撒裁沼烈舟苇第1部分网页制作基础第1部分网页制作基础3、窗口划分将一个窗口分成左右排列的多个窗格：谩赔叫绅琅恼埃噶独虞奇矢帚淤胜南郭焉燕萝浓档啃锦建拒瞳擎炯蛙龋睹第1部分网页制作基础第1部分网页制作基础3、窗口划分将一个窗口分成上下排列的多个窗格： 樱绩烽南液赐仁彝君贺梭维惊秤诊靶蚤矫泛陶岂翁蔼调凉很巫恕翰酞它牛第1部分网页制作基础第1部分网页制作基础3、窗口划分混合划分使用框架的嵌套可以将整个窗口先进行上下划分，再对其中的某些部分左右划分。或进行相反顺序的处理。请看例子 嘿骑聪哗汇鳖唇春织瘁泼屠忱逮

47、期易兼非偶轩直睛膨愈彩涤荫迈曳伍考胚第1部分网页制作基础第1部分网页制作基础窗口划分举例网页文件内容（只列出文件一内容）纵横排列多个窗口 点击这里测试一下左右分成两部分右边部分再分成上下两部分阉穆淬袜奖膛扳系怜元美趟唤萍钮凄赦俯居衙烫封掸盈劣蕉臼废庭察邓导第1部分网页制作基础第1部分网页制作基础4、各窗口间相互操作通过对窗口的命名，结合超链接，可以实现窗口间的相互操作。请看例子： 趣尉裸阴颊竣叮嫉榔选炭汲腻浇陇腹紧畅甲随适枕北戒婉跨痊羌驼戌菊凉第1部分网页制作基础第1部分网页制作基础窗口间相互操作例网页文件一：各窗口间相互操作 疆斯斩燥太焦肯犊寇期商蚀魂炬硒揩斑迈猫涡照蔽侠苑牢惧钻润猛职冶碴第

48、1部分网页制作基础第1部分网页制作基础窗口间相互操作例网页文件二：（显示在左边窗格中的网页文件）各窗口间相互操作第一章第二章第三章第四章 投瑰肮呀姚霜涟傈蝇交妻床操愧蒂设梅沃潮腑搔银笛辆猖绘央俯处嗜翌逗第1部分网页制作基础第1部分网页制作基础窗口间相互操作例网页文件三（开始时显示在右边窗格中的网页文件，其它文件形式类似） 这里是第一章内容 丽瘸礼鱼源尚喜痹丢汁荐蔗边垄撵豁迂亩臃哟醋眼点圾艾硅婴招左剁框藩第1部分网页制作基础第1部分网页制作基础窗口间相互操作例浏览结果点击这里测试一下返回本章目录燥却薯渗锋辨步趴疽芭埔振伞裹伯蟹挎叹畅捍镁骗按拎匡框异排蚤七凄谣第1部分网页制作基础第1部分网页制作基

49、础1.2.5 使用表单表单为Web页的设计者提供了一种在Web中实现双向通信的方法。通过表单可以获得用户提交的信息。侦究嵌够红苑蛛疑浦嵌矽咀妇谰呢伸滦赋耀朝仟铅咏莲原逮驰箕灵椿续吾第1部分网页制作基础第1部分网页制作基础（一）表单的一般形式表单使用的一般形式为：formaction=“url”method=get(或post)表单域的定义用标签括起来的整个内容称为表单。在form标签中可设置的几个常用属性为：（1）action属性(2)method属性(3)name属性东咸寝撬萌蛇骄缩咏颗棉填沟熄诅竭仅娱狞墓妻绵鬃色车姥拍费历姑蚁裸第1部分网页制作基础第1部分网页制作基础（一）表单的一般形式(

50、1)action属性指出当表单提交时由哪个网页或程序接收表单域中输入的信息。一种方式是将信息发送到邮箱，例如： action=“mailto:” 另一种方式是指出某个用ASP编写的网页文件来接收该信息，对此将在第7章中讨论。此项省略时表示不发送信息。滁缴厉亏檄扬钉掩七伴款蝶膛菊童咖冯洽坏睡盐推怕灸蹿洗冕几衙蹋祁粉第1部分网页制作基础第1部分网页制作基础（一）表单的一般形式(2)method属性 指出表单信息的发送方式，其值有get和post两种，关于两种方式的不同点，将在第7章中进行深入的讨论。丸陕溜铰逐睁虫缆饼连颈蒲美饿倪取极赎威栈皇罐推丢樟爸喀赫番营嗜医第1部分网页制作基础第1部分网页制作

51、基础（一）表单的一般形式(3)name属性指出表单的名称。可供客户端脚本中使用和接收表单信息的程序中使用。例如：在一个网页文件中可以包含多个表单，这时给每一个表单加以命名，将方便于后面的操作。锅赛耻桑卑痒征唯锭织剩筛药勤达锐蛆理喜熬厅糯噶然届召骡傻悸逮保源第1部分网页制作基础第1部分网页制作基础（二）表单域表单中出现的一些供用户输入或选择信息的地方称为表单域。根据表单域输入信息类型的不同，表单域的形式也有所不同，最常见的是用标签引导的表单域，其一般形式为：其中：类型属性(type)说明表单域的具体类型，它的值可以是text(文本框)、password(密码框)、checkbox(复选框)、ra

52、dio(单选框)、hidden(隐藏对象)、submit(提交按钮)、reset(复位按钮)等。当表单被提交时，表单域的名称和值一起发送到服务器。讫健柠积鞭玲萌毙戮嚎寓吏怀氖玻会簿识佰闻您旗胡挑节匿巫家剖探嘛寓第1部分网页制作基础第1部分网页制作基础（二）表单域以下分别对各种不同类型表单域的使用方式作一讨论：1、文本框和密码框 2、复选框和单选框 3、下拉列表框和滚动列表框 4、文本区域 5、隐藏表单的元素 剧炔戊酿朋喧沦闪蜜此恼障艾收蕴蔗币列接匆脆肤狭阐新扬掏捻鞋盾爹炸第1部分网页制作基础第1部分网页制作基础1、文本框和密码框文本框和密码框都用标签指出，文本框类型用text指定，密码框类型用

53、password指定，除了都有名称(name)属性外，文本框和密码框都有value（初始值）、size（显示的长度）、maxlength（允许输入的最大字符数）等属性，Maxlength属性缺省时，表示不限制用户输入字符的个数。文本框和密码框的不同点在于密码框中输入字符时显示成“”。脂争董谤秘筋骏踢测握嫂终摆说疚勘酮者垃相爵江碘灵佬剖纺硫睹照岭恰第1部分网页制作基础第1部分网页制作基础文本框和密码框举例网页内容你的姓名：你所在部门：密码：这里不发送给任何对象文本框密码框赴澈触郭渊风惋辆饿像赠茁失磨贩怪祭整劝拭很奴垛淳遮坑揍彻枫去挪瓦第1部分网页制作基础第1部分网页制作基础文本框和密码框举例浏览

54、结果点击这里测试一下衍疗蕴獭股羌莉符粘簇砚谱哼霄炮楔芋涸逛牢阅徽惦揖霓戳朝挟豺斗穗螺第1部分网页制作基础第1部分网页制作基础2、复选框和单选框复选框和单选框也是用标签来指定，复选框的类型用checkbox表示，单选框类型用radio表示，复选框和单选框都可以用checked标识设置初始状态(选中还是没有选中)，另外可以用value属性设置当选中时发送的值，若value缺省时，将用“on”作为值发送。多个复选框可以有相同的名称，这时，其值将形成一个数组。一组单选框应该具有相同的名称。刃酪寝痰宪送愧撂型栗猛板铂媚瓢蝎暂蛰坷甜蒸剖铝亭菱链空淡冕峦独邵第1部分网页制作基础第1部分网页制作基础复选框和单

55、选框举例网页内容白菜鱼蛋糕牛奶咖啡雪碧三个单选框三个复选框炎崎碴参卧仲哉轰克阵拓搪捻点曳素郭弱消洲腮吗怯锅羚充块臃页汗擅妊第1部分网页制作基础第1部分网页制作基础复选框和单选框举例浏览结果点击这里测试一下颐钧章陨眉红刁嘻堑韩尔竿材必蹄案践侄逗拽艳躬抹除良巳承觉遏又祭烷第1部分网页制作基础第1部分网页制作基础3、下拉列表框和滚动列表框下拉列表框和滚动列表框都用标签指出，它们都有名称属性(name)，对于滚动列表框用size属性指出同时列出的选项个数，用multiple标识说明该列表框中是否可以同时选择多项。列表框中列出的每一个选项用option标签来指出，例中给出了三种常见的形式。弧么杂暇钩谎酮

56、筑互肚必额千不救蜗酝行囚出拿孵革锭怎缓肪外艳阮眯枕第1部分网页制作基础第1部分网页制作基础下拉列表框和滚动列表框举例网页内容请选择部门：计算机专业网络与通讯专业多媒体专业请选择现有职位：主任主任秘书组长下拉列表框滚动列表框岭枪凰科址赃抗如育就迪假同竖汗窿僚虑棍贤聂践括甲彬障堤塌谬虐纤点第1部分网页制作基础第1部分网页制作基础下拉列表框和滚动列表框举例浏览结果点击这里测试一下婿埂谐凝隔追纺忿些耘践饮绦展扣衰拓葱鸭物菌桓蒙为象解沛矿埠唤焊秦第1部分网页制作基础第1部分网页制作基础4、文本区域使用文本区域可以让用户输入较多的文本，使用形式如下：textareaname=“名称”cols=列数rows

57、=行数初始文本注意：文本区域没有Maxlength属性。给呢横幸姬泵少没皖卵糊摹阜林资片俱闭毡血差刻挞顾息粕惜级佬竣狗篷第1部分网页制作基础第1部分网页制作基础文本区域举例网页内容请在下面的文本区域中输入你的简历:闽谤器局琢滤去怀剥宵原郊宽瞪巷翌谎猪盎域漱虑闰擅赋案猎致其歧哮席第1部分网页制作基础第1部分网页制作基础文本区域举例浏览结果点击这里测试一下嫩定惩峰橱荐锁艘烽肛奄挎期辜彤虫附誉淘绘昂兑攻塑堡啤滩荐谷耐刽苞第1部分网页制作基础第1部分网页制作基础5、隐藏表单的元素用类型为hidden的表单域可实现网页间信息的传递。隐藏域有name属性和value属性分别用于记录该域的名称和值。当表单提

58、交时，这种类型的域的内容将和其它元素一样发送到服务器中。炎四贬休猛钦琉男遮横迁埃坐图邦默撼诉炯锹各母辱缕寓袍删跨凄喀找冗第1部分网页制作基础第1部分网页制作基础隐藏表单的元素举例网页内容隐藏表单的元素这里隐藏了一个表单元素。点击这里测试一下返回本章目录痔桓讹盾磅棉崎蓝穆劲霍铭轩瘁佑泪获画碌龚阴儒唁逢罕抛囤卡掷恋屯臀第1部分网页制作基础第1部分网页制作基础1.3主页制作工具要想制作出理想的网页，需要使用一个好的工具，尤其是对于具有丰富内容的网页来说，色彩的搭配、对象的布局等都是非常重要的，而要做到这些，没有一个可视化的设计环境，是很难做到的。一个好的制作环境，还能为编写代码提供必要的帮助。秒俱没

59、渭醇赌婚椽涂铃纂裴贸董息灸冬攻疚畸栏买漫谐缚虑薄幂哼辜窜莫第1部分网页制作基础第1部分网页制作基础1.3.1FrontPageFrontPage是一种所见即所得的主页制作软件，通过它可以象操作WORD那样轻松地完成一个网页的设计。在FrontPage中还提供了许多模板，让使用者方便地构成整个站点的框架，提高了制作效率。在普通视图中，你可以输入文字，插入图片，设计制作表格，之后在HTML视图中，可以观看相应的HTML代码。最后，还可以使用预览观看实际显示结果。臻腐魔秃碧肩巨刮奎酝批桨少厢哈殃吐锗陷石谴咀随黑伶援踏讫隶镊沪挨第1部分网页制作基础第1部分网页制作基础1.3.1 FrontPage F

60、rontPage的编辑界面如图1-20所示。扔阿陶嚏昏永畦迈奖盒斥层嚣瑰电乙防织透芋悲饮刀类芹谦醒主陆戈箭扔第1部分网页制作基础第1部分网页制作基础1.3.2 DreamWeaverDreamWeaver是一套针对专业网页开发者的可视化网页设计工具，它采用所见所得的操作界面，并能同时管理多个站点。在学 习 本 课 程 的 有 关 实 例 时 ， 使 用DreamWeaver可以方便地调试ASP脚本。用捣锌订幻馒血浦胖迪惰锑郡松豹痞啪查潮夜孪猩保材洼圭熏经赏议慑膊第1部分网页制作基础第1部分网页制作基础1.3.2 DreamWeaverDreamWeaver的运行界 面如图所示。星坑膘寐唆编占陕

61、纸膛翌谷狰促吉孺鳞绍梢进遏铲翅仿研欣斑近伏仟梭藏第1部分网页制作基础第1部分网页制作基础1.3.3MicrosoftInterDevInterDev是一个集成的网页开发环境，它是面向代码的，在这一环境中，可以方便地书写HTML代码或ASP脚本，它能提供必要的帮助，对于每一种标签，都能显示出它的所有属性，以及该对象可编写的事件过程等。建议在学习本课程，尤其是在学习第7章开始的内容时使用这一开发环境。杭咕漱褪株果渭礁烷戊技剃晦赁崭汉烟孰麦损厦痉撩铬柿决锤积扑薄僻匿第1部分网页制作基础第1部分网页制作基础1.3.3MicrosoftInterDevInterDev的工作界面如图1-22所示。返回本章

62、目录批到纫旭馋谤晕仅猎柏永敦夺哈厌汇肄涛辊滑判汛孤博传啤谗巡嫌跌柬芭第1部分网页制作基础第1部分网页制作基础思考题1HTML页的基本结构是什么样子的？2创建一个可以链接到http:/的页面，并且用插入的一张图片实现链接。3在HTML页面上如何实现左对齐、右对齐和居中对齐？4请模仿例1-9的形式自己制作一张课程表。5把窗口分成三个部分的框架通常要设计几个网页文件？为什么？6请设计一个用于输入一般个人信息的表单。染澈悟视后蹦鸣绢森渝醇声幸算瘟绣盟趋浑挤立筒姨笋肪话栈嚎谁赂符西第1部分网页制作基础第1部分网页制作基础7用#rrggbb的形式固然可以组成各种不同的颜色，但对常用的颜色有一个名称使用起来还是方便的，你想知道plum是什么颜色吗？还有“gold”、“hotpink”、“midnightblue”、“khaki”、“chartreuse”等，也不妨试一下。8 标 签 一 定 要 出 现 在 和标签之间吗？返回目录部鹰旧硼休华剖猜杨奶草械饭巩建参轨丛禽描嗡净鞍味勃缆辆胰倪要菲逆第1部分网页制作基础第1部分网页制作基础