900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > 关于html表格结构标签thead tfoot tbody使用出现不兼容性

关于html表格结构标签thead tfoot tbody使用出现不兼容性

时间:2021-10-12 22:37:34

相关推荐

关于html表格结构标签thead tfoot tbody使用出现不兼容性

关于尽量不使用thead,tfoot,tbody这三个表格结构标签,存在浏览器兼容性问题的验证

以下是不使用这三个标签时代码demo以及运行效果(搜狗浏览器下运行):

<body><table width="700" height="150" border="1"><caption>表格标签的兼容性问题</caption><tr><td width="98">页眉1</td><td width="87">页眉2</td><td width="137">页眉3</td><td width="80">页眉4</td></tr><tr><td>页脚1</td><td>页脚2</td><td>页脚3</td><td>页脚4</td></tr><tr><td>表主体内容1</td><td>表主体内容2</td><td>表主体内容3</td><td>表主体内容4</td></tr></table></body>

再来看看加上这三个标签后:

<body><table width="700" height="150" border="1"><caption>表格标签的兼容性问题</caption><thead><tr><td width="98">页眉1</td><td width="87">页眉2</td><td width="137">页眉3</td><td width="80">页眉4</td></tr></thead><tfoot><tr><td>页脚1</td><td>页脚2</td><td>页脚3</td><td>页脚4</td></tr></tfoot><tbody><tr><td>表主体内容1</td><td>表主体内容2</td><td>表主体内容3</td><td>表主体内容4</td></tr></tbody></table></body>

以上都是在搜狗浏览器下运行效果,可以发现,虽然加上< thead> < tfoot > < tbody >这三个表格结构标签后,页脚的 “页脚 1234” 确实被放在最后一行呈现,但表格的布局样式被完全改变了,然后尝试在< tfoot > < tbody > 乃至< thead >中加上style="height:150"后重新在搜狗浏览器中运行发现仍无法恢复原表格样式(效果未给出),当然这是由于浏览器兼容性导致的,在ie浏览器中运行则显示正常。

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