700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > HTML中table表格的常用标签及属性

HTML中table表格的常用标签及属性

时间:2019-12-29 04:56:56

相关推荐

HTML中table表格的常用标签及属性

table表格的常用标签及属性

<table border="1" cellspacing="0" cellpadding="5"><caption>基本信息</caption><!-- 单独给列设置样式属性 --><col width="100px"> // 第一列<col width="100px"> // 第二列<col width="150px"> // 第三列<col width="110px"> // 第四列<!-- 批量给列设置样式属性 --><colgroup><col span="2" width="100px"> // 前两列<col span="1" width="150px"> // 第三列<col span="1" width="110px"> // 第四列</colgroup><tbody><tr align="center"><td>姓名</td><td>年龄</td><td>手机号</td><td rowspan="3">照片</td></tr><tr align="center" valign="top" height="50px"><td>五</td><td>18</td><td>12345678901</td></tr><tr><td colspan="3">合并列</td></tr><tr></tbody></table>

效果如下

常用标签

<caption>:表格标题,居中在表格上方

<col>:单独给每列设置样式属性

<colgroup>:批量给列设置样式属性

常用属性

border

【表格默认无边框】

【设置了border为1px,表格有边框,但边框与边框之间默认有一定的间距】

cellspacing

【设置边框与边框之间的间距,cellspacing="0"可以让边框变成单线】

cellpadding

【设置单元格内填充,cellpadding=“5”,表示文字与单元格边框之间有5px的间距】

rowspan

【合并行】

colspan

【合并列】

align

【水平方向对齐方式】

valign

【垂直方向对齐方式】

border-collapse: collapse

【添加单线,同cellspacing = 0】

empty-cells: hide;

【隐藏空的单元格】

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。