模块3xhtml基础模块3html基础模块3xhtml基础模块3xhtml基础.ppt

* 《基于Web标准的网页设计》 任务扩展——制作“家乡简介”网页 【任务描述】 　　每个人对于自己的家乡都有着深厚的感情，下面设计一个网页来简单介绍自己家乡的风情文化、旅游景点及特产等情况。要求能够灵活运用所学知识，在网页中对文本、图片、列表进行设置，充分展现家乡风貌（以下例子仅供参考）。 【源代码展示】 　　!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN /TR/xhtml1/DTD/xhtml1-transitional.dtd 　　html xmlns=/1999/xhtml 　　 head 　　 title【烟台简介】/title 　　 /head 　　 body bgcolor= FF90FF 　　 h2 align=center烟台简介/h2 * 《基于Web标准的网页设计》 　　nbsp;nbsp; nbsp;nbsp; font size=4 烟台位于山东半岛东部，濒临渤海中部，与韩国、日本隔海相望，总面积1.37万平方公里，总人口641万。海岸线长达909公里，年平均气温在12℃左右，是一座美丽的海滨城市。烟台是中国北方著名的海滨旅游城市，景色秀丽，气候宜人。烟台绵长弯曲的海岸线上，散布着许多旖旎的海岛、漂亮的港湾和金沙碧浪的海滩。一年四季林木葱茏，明媚如画。春天，满山苍翠，花香袭人；夏日，郁郁葱葱，一片生机；秋季，果林红叶，五彩纷呈；到隆冬时节，银装素裹，玲珑剔透。这里有新鲜可口的海鲜，还盛产苹果、大樱桃、梨和葡萄，欢迎您来尽情品尝！/fontbr/ 　　 img src= /LEgiF2K24_jupiter width=210 height=150 alt=烟台 / 　　 img src=image\yt1.jpg width=210 height=150 alt=烟台/ 　　 img src=image\yt2.jpg width=210 height=150 alt=烟台/ 　　 img src=image\yt3.jpg width=210 height=150 alt=烟台/ 　　　　img src=image\yt4.jpg width=210 height=150 alt=烟台/br/ 　　 strong特色饮食：/strong 　　 ul 　　 lispan style=margin-left:10px;/span烟台焖子/li 　　 lispan style=margin-left:10px;/span鲅鱼水饺/li 　　 lispan style=margin-left:10px;/span海菜灌浆蒸饺/li 　　 lispan style=margin-left:10px;/span叉子伙食/li 　　 /ul 　　 /body 　　/html * 《基于Web标准的网页设计》 【运行结果】 　　程序运行结果如图3-24所示 图3-24 运行结果 * 《基于Web标准的网页设计》 【任务分析】 　　 在该网页上通过文字、图片展示了家乡的基本风貌。整个页面布局简单，主要分为3部分，上面部分主要是文字，对文字进行了排版，运用与文字相关的font标记元素设置字体；中间部分是图片展示区，在该区域运用img标记元素对图像的大小、来源、提示信息进行设置；下半部分运用了无序列表ul、li标记元素简单介绍了家乡特色。 　　 在网页设计中要综合考虑布局、色彩、内容等各因素，才能给浏览者留下深刻的印象。 * 《基于Web标准的网页设计》 思考与练习 一、填空题 　　1.XHTML的基本结构主要包括3部分：____________、____________和主体body。 　　2.XHTML文档是从文档类型声明开始的，在XHTML 1.0中有3种文档类型定义声明可以选择，即__________、____________和____________。 　　3.在网页中显示特殊字符，如果要输入“”，应使用___________。 　　4.在font标记符中，可以使用_______属性指定文字颜色，可以使用________属性指定文字大小（字号）。 　　5.XHTML的元素必须被正确地______，不能出现______，而HTML则可以彼此交叉嵌套。 　　6.XHTML的元素必须被关闭，非空标签必须使用_______