HTML+CSS+DIV网页设计与布局 教学课件 作者 聂斌 1_ 第4章 表格.ppt

资源描述：

《HTML+CSS+DIV网页设计与布局 教学课件 作者 聂斌 1_ 第4章 表格.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第4章表格在文档处理中，表格是一种很常用的表现手法。在HTML中的表格除了用来对齐数据之外，更多地用来进行页面排版。无论是普通的HTML页面还是动态网站都需要使用表格来进行页面的布局。4.1创建表格表格的开始元素是

，结束元素是。所有的表格内容都位于这两个元素之间。要创建一个完整的表格，除了包含表格元素外，还要有行元素和单元格元素。可以说，在页面中如果要创建一个完整的表格，至少要包含这3个元素。创建表格的具体语法是：

表格的内容

4.2表格属性默认情况下，表格只是作为布局的手段，因此不会

2、在页面中显示出来。但有时候，将表格显示出来并设置一定的效果，能使页面内容更加协调。4.2.1表格宽度默认情况下，表格的宽度是以内容为标准的。如果要设置表格的宽度为某一特定值，而与其中的内容无关时，则可以使用WIDTH属性，其语法如下：表格的内容4.2.2表格高度除了可以为表格指定宽度之外，还可以为表格指定高度。通常表格的高度都是由表格的行数及单元格里的内容决定，在为表格指明高度之后，如果表格的行数与单元格里的内容使表格的高度高于指定的高度，则浏览器将以实际的高度显示表格，如果实际高度低于指定高度，则浏览

3、器以指定高度显示表格。

元素里的HEIGHT属性值可以用来指定表格的高度，其语法如下：

表格的内容

4.2.3表格背景图片通过元素中的BACKGROUND属性，可以为表格指定一个背景图片。这种方法有点类似为网页指定背景图片。如果背景图片小于表格大小，则会平铺该背景图片以充满整个表；如果背景图片大于表格大小，而会对背景图片进行裁剪，以适应该表格。其语法如下所示：

表格的内容

4.2

4、.4单元格间距单元格间距是指表格中两个相邻单元格之间的间距和单元格与表格边框的间距。在默认情况下，单元格与单元格之间的间距是两个像素。通过设置

元素中的CELLSPACING属性值，可以增大或缩小单元格之间的间距。其语法如下所示：

表格的内容

4.2.5表格内单元格与文字的距离表格内单元格与文字的距离是指在单元格内，文字与单元格边框的距离。默认情况下，文字是紧贴着单元格的边框出现的，这样会显得页面的内容有些拥挤，可以通过元素中的CELLPADDING属性来调整这一距离，

5、其语法是：

表格的内容

4.3表格边框表格的用处很多，不过只要不是涉及到网页排版，通常都会将表格边框显示出来。而且要设置表格的属性，就要先将表格的边框显示出来，这样才能更好地查看表格的效果。HTML中为元素提供了多个属性用于设置表格边框的样式。4.3.1边框宽度在HTML中，默认表格的边框宽度为零，即不显示表格的边框。如果要显示表格的边框，就必须要为表格指定边框宽度。在HTML中，可以使用元素中的BORDER属性来设置表格边框的宽度。其语法如下所示：

6、BLEBORDER=表格的边框宽度>

表格的内容

4.3.2边框颜色默认情况下，边框的颜色是灰色的。如果整个页面设置了特定的颜色，那么为了使表格和整个页面协调一致，就应该为表格的边框设置一个搭配的颜色。可以使用元素中的BORDERCOLOR属性来设置表格边框的颜色。其语法如下所示：

表格的内容

4.3.3亮边框颜色在HTML中，除了可以设置表格的边框颜色外，还可以将边框划分为亮边框和暗边框。亮边框就是光线照

7、到的边框，一般认为是表格外部的上边框和左边框，以及内部的下侧和右侧边框为亮边框。可以通过

元素中的BORDERCOLORLIGHT来设置表格亮边框，其语法如下所示：

表格的内容

4.3.4暗边框颜色与表格的亮边框相对应的就是暗边框，一般认为是表格外部的下边框和