首页 > Web开发 > 详细

HTML表格中各元素标签的位置对style属性有效性的影响

时间:2019-12-06 18:41:24      阅读:104      评论:0      收藏:0      [点我收藏+]

开发了一个动态表格制作程序,用的是谷歌浏览器。发现几个现象,记录如下:

1、按照技术文档的说法,正规的表格样式如下:

<table>

<caption>标题</caption>

<colgroup>

<col>  //我在这里设置了各列的背景色彩、列宽

......

<col>

</colgroup>

<tfoot>。。。。。。</tfoot>  //技术文档说,要放在这里。

<thead>

<tr>   //设置表头

<th>表头1</th>

......

<th>表头n</th>

</tr>

</thead>

<tbody>

<tr> 

<td>表格1</td>

.......

<td>表格n</td>

</tr>

......

</tbody>

</table> 

2、设计中发现,具备上述完整格式标签的结构,会出现有的属性失效。

(1)如果有<tbody></tbody>则里面的背景色、宽度均无效。但<thead></thead>里面的表头宽度不受影响。

(2)如果删除<tbody>和</tbody>,同时删除<thead>和</thead>,则<col>标签设置的背景色和宽度均有效,查看开发者工具,发现谷歌浏览器已经自动添加了<tbody></tbody>。

(3) 如果删除<colgroup></colgroup>则浏览器会自动添加。同时<col>标签设置的属性有效。

(4)谷歌浏览器不自动添加<thead></thead>标签。

(5)谷歌浏览器自动将<tfoot></tfoot>移动到最后。

3、上述现象没有在其他浏览器上观察过,发现同类问题的朋友可以在下面留言交流。

 

 

HTML表格中各元素标签的位置对style属性有效性的影响

原文:https://www.cnblogs.com/nxmxl/p/11996854.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!