第五章:表格

来源:互联网 发布:g92的编程实例 编辑:程序博客网 时间:2024/06/05 07:58

表格

表格标记:

<table>
   <tr>
<th>表头内容</th>
<td>......</td>
<td>......</td>
<td>......</td>   </tr>
   <tr>
<td>......</td>
<td>......</td>
<td>......</td>   </tr>
</table>
表格属性修饰属性描述border边框粗细bordercolor边框颜色(可以使用英文单词或者6位16进制颜色值)width表格宽度 (像素[不可变]或百分比[随窗口大小])height表格高度 (像素[不可变]或百分比[随窗口大小])bgcolor背景颜色 [同边框颜色]background背景图片 [url]frame边框样式rules内部边框样式cellspacing单元格间距cellpadding单元格边距align表格水平对齐方式
表格标题: <caption>标题内容</caption>

frame的属性属性描述above显示上边框below显示下边框hsides显示上,下边框lhs显示左边框rhs显示右边框visdes显示左右边框border显示上下左右边框void不显示边框
rules的属性属性描述all显示所有内部边框none不显示内部边框cols仅显示列边框rows仅显示行边框groups显示介于行列间的边框
设置表格的单元格间距:
<table cellspacing="单元格间距>表格内容</table>(像素单位)

设置表格边框与内部文字间距:
<table cellpadding="边框与内部文字间距">表格内容</table>(像素单位)

设置表格内容的对齐属性:
<table align="left(左)|center(中)|right(右)>表格内容</table>

单行和单表格都可以设置等同于总表格属性修饰设置整行内容对齐属性:
<tr align="left|center|right"(默认为left)>行内表格内容</tr>

设置行内容在列方向上的对齐属性:
<tr valign="top(上)|middle(中)|bottom(下)[默认middle]>行内表格内容</tr>

设置单元格跨行:
<td rowspan="跨的行数">单元格内容</td>
设置单元格跨列:
<td colspan="跨的列数">单元格内容</td>

课程表节次/日期一二三1体育数据结构web开发2英语实验PS:在进行跨行跨列的操作时,在需要跨的行列的上一行必须留出空白单元格







源代码如下:
<table width="600" border="1" align="left">
<caption>课程表</caption>
<tr>
<th>节次/日期</th>
<th>一</th>
<th>二</th>
<th>三</th>
</tr>

<tr>
<td>1</td>
<td>体育</td>
<td rowspan="2">数据结构</td>
<td>>web开发</td>
</tr>

<tr>
<td>2</td>
<td>英语</td>
<td>实验</td>
</tr>

<tr><td colspan="4" bgcolor="cornflowerblue">PS:在进行跨行跨列的操作时,在需要跨的行列的上一行必须留出空白单元格</td></tr>
</table>
原创粉丝点击