Week3---9月25日 表格

一、复习

1、滚动字幕的制作

2、课程表检查

3、实验7第一题操作

二、表格

1、 设置表格标题<caption>

一般情况下，表格都需要有一个标题来对表格内容进行简单的说明。在HTML文件中，使用成对的标记<caption></caption>插入表格标题，该标题应用于<table>标记与<tr>标记之间的任何位置。

基本语法

<table>

<caption>插入表格标题</caption>

<tr>

</tr>

<tr>

<td ></td>

</tr>

</table>

2、表格属性设置

1）设置边框属性

在网页设计中，经常会需要对表格的边框属性进行一些特殊的设置。
基本语法：

<tableborder=" " bordercolor=" ">

<tr>

<td></td>

</tr>

</table>

2）设置宽度和高度属性

在网页制作过程中，为了满足网页设计的要求，需要对表格的宽度和高度进行一定的设置，在HTML文件中更改表格标记<table>的width和height属性值就可以实现。
基本语法

<tablewidth=" " height=" ">

<tr>

<td></td>

</tr>

</table>

3）设置表格背景颜色和背景图片

在HTML文件中，表格的默认背景为白色，根据网页布局风格的要求，常常需要设计网页中表格背景的颜色。设置表格的背景颜色只要设置<table>标记中的“bgcolor”属性即可。
基本语法

<tablebgcolor=" " background="图片路径">

<tr>

<td></td>

</tr>

</table>

4）设置单元格间距和边距

A.设置单元格间距

在网页文件中，使用表格进行排版时，为了布局的美观，常常需要对单元格的间隔进行设置，这样可以使网页中的表格显得不是过于紧凑。
基本语法
<tablecellspacing=" ">

<tr>

<td> </td>

<td> </td>

<td> </td>

</tr>

</table>

B设置单元格边距
在网页文件中，单元格的边距指的是单元格中内容与单元格边框的距离。
基本语法
<tablecellpadding=”0”>

<tr>

<td> </td>

</tr>

<tr>

<td> </td>

</tr>

</table>

5）设置水平对齐

在水平方向上，可以设定表格的对齐方式，分别有居左、居中、居右3种。
基本语法

<tablealign=”value”>

</table>

6）合并单元格
A 对网页中的表格进行单元格的纵向合并，这在网页中叫做设置跨行

在HTML文件中，设置单元格的跨行，只要设置<td>标记中的rowspan的属性值即可实现。

B对网页中的表格进行单元格的横向合并，这在网页中叫做设置跨列。

在HTML文件中，设置单元格的跨列，只要设置<td>标记中的colspan的属性值即可实现。