小白程序员的第二天

不念不忘少年蓝@ 2024-02-18 16:13 64阅读 0赞

Table表格

一完整表格是由：表的标题  表头 表内容 表尾构成的

完整表格的好处：可以更好的提高浏览器加载的效率

<table>

<caption>title</caption>//标题（默认居中）

<thead>//表头（有默认加粗居中样式）

<tr>//表示行

<td>//表示列

</td>

</tr>

</thead>

<tbody>//身体

<tr>

</tr>

</tbody>

<tfoot>//表尾

<tr>

</tr>

</tfoot>

</table>

当表格宽度不够内容的宽度是内容将撑起表格的宽度

如果表格的宽度足够显示内容时

这时表格的宽度局势你设置的宽度

二文字换行

超出div宽度连续的英文不会自动换行

系统认为空格中文是换行的标志

到达长度系统强制换行

三表格的合并（合并几那一行或几列就要删除对应的几行或几列）

合并行rowspan

和并列colspan

列子：

<caption>练习课程表</caption>

<tr>

</tr>

<tr>

<td rowspan="3">大数据库应用开发</td>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

</table>

效果图：

四表格的样式；

cellpadding="0" 单元格的内边距

cellspacing="0" 单元格之间的距离

rules 显示 内边框的分割线

rows 显示行

cols 显示列

all 都显示

今天的中点是表格合并的运用，理解表格的合并在加以熟练就可以了

</tr>

<tr>

<td rowspan="3">大数据库应用开发</td>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

</table>

效果图：

**四表格的样式；**

cellpadding="0" 单元格的内边距

cellspacing="0" 单元格之间的距离

rules 显示 内边框的分割线

rows 显示行

cols 显示列

all 都显示

今天的中点是表格合并的运用，理解表格的合并在加以熟练就可以了

小白程序员的第二天

发表评论取消回复

还没有评论，来说两句吧...

相关阅读

相关给小白程序员的建议!

相关小白程序员的第二天

相关小白的第二个项目--扫雷游戏

相关小白学习C语言第2 天

相关小白踩坑记第二章：Python第二期

相关第二天

相关微信小程序第二天—小白之路

相关 Bug记录-----第二天（蝼蚁虽小......）

相关第二天

相关第二天