网页制作 第一章【荐】.pptVIP

图1-24表格的单元格合并的显示效果 返回 图1-25网站主页 返回 1.4 HTML基础 /tr /table 显示效果如图1-21所示。 2)表格的外观 表格的外观包括下列属性。 (1) width属性:指定表格或某一个单元格的宽度，单位可以是百分比或像素。 (2) height属性:指定表格或某一个单元格的高度，单位可以是百分比或像素。 (3) border属性:指定表格边线的粗细。 (4) bordercolor属性:指定表格或某一个单元格的边框颜色。 (5) bordercolorlight属性:指定亮边框的颜色。 返回 下一页 上一页 1.4 HTML基础 (6) bordercolordark属性:指定暗边框的颜色。 (7) bgcolor属性:指定表格或某一个单元格的背景颜色。 (8) background属性:指定表格或某一个单元格的背景图片，其属性值是一个URL地址。 3)表格的间距 表格的间距包括下列属性。 (1) cellspacing属性:用于设置单元格间距。单元格间距是指单元格之间的距离。 (2) cellpadding属性:用于设置单元格边距。单元格边距是指单元格内部文字与边框之间的距离。 返回 下一页 上一页 1.4 HTML基础 添加表格间距示例: table border cellspacing=8 tr th姓名/ th th性别/ th th成绩/ th /tr tr td徐元平/ td td男/ td td85/td /tr 返回 下一页 上一页 1.4 HTML基础 /table 显示效果如图1-22所示。 添加表格边距的示例: table border cellpadding=12tr th姓名/ th th性别/ th th成绩/ th / trtr td徐元平/ td td男/ td td85/td/tr/table 显示效果如图1-23所示。 返回 下一页 上一页 1.4 HTML基础 4)表格的单元格合并 表格中的某些单元格需要占据多行或多列，称为表格的跨行与跨列。它包括下列属性。 (1) colspan属性:用于设置当前单元格跨越几列。 (2)rowspan属性:用于设置当前单元格跨越几行。 示例: table border=1tr th colspan=+3;成绩统计/th /tr tr th姓名/ th th性别/ th th成绩/ th /tr 返回 下一页 上一页 1.4 HTML基础 tr d徐元平/td td男/td td85/td /table 显示效果如图1-24所示。 返回 下一页 上一页 应用实践1网页基础知识 一、实验目的 (1)掌握网页组成元素。 (2)理解网站、网页、主页等概念及区别。 (3)理解网页风格的重要性。 二、实验软硬件环境 一个正常工作、能上网的计算机机房。 三、实验要求 根据观察所得结果，能够从网页中分析网站的基本元素，并掌握其开发流程。 返回 下一页 上一页 应用实践1网页基础知识 四、实验内容与步骤 1.以不同的方式打开网站主页 (1)打开IE浏览器，输入http;//。即可打开163网站的主页，如图1-25所示。 (2)打开IE浏览器，输入网址http;///index. htm，看是否也能打开主页。 分析:查看这两种方式打开的主页是否一样，若一样，试说明为什么会出现此类情况。 2.判断网页元素 图1-25所示为163网站的主页，区分网页上哪些为flash元素，哪些为图片。 将该主页中的所有图片，保存在“我的文档”上的tu子目录内(若没有，自行创建)。 返回 下一页 上一页 应用实践1网页基础知识 3.查看网页风格 分别以“1024 x 768”及“800 x 600”两种分辨率浏览同一网站，操作步骤如下: (1)设置屏幕分辨率的方法为，右击桌面，选择“属性”选项，在“设置”选项卡的“屏幕分辨率”内拖动鼠标选择合适的分辨率。 (2)打开IE浏览器，输入http;//网址。 分析:屏幕分辨率对网页影响有多大，目前网站在设计时一般使用的最佳分辨率是多少? 4.选出一个最喜欢的网页，然后列出3点喜欢的理由。 返回 下一页 上一页 图1-1浏览器与主页 返回 图1-2网站设计的工作流程 返回 图1-3源文件窗口 返回 图1-4在记事本中输入HTML程序 返回 图1-5显示效果 返回 图1-6 templet.htm 返回 图1-7设置文本属性的显示效果 返回 图1-8文本的修饰设置的显示效果 返回 图1-9文本的修饰的显示效果 返回 图1-10分段与分行的显示效果 返回 图1-11文本的对齐 返回 图1-12水平线的显示效果 返回 图1-13列表标记显示效果 返回 图1-14有序列表的显示效果 返回 图