border-style: none和border-style：hidden的区别

最新推荐文章于 2024-06-24 06:45:20 发布

qinchao888

最新推荐文章于 2024-06-24 06:45:20 发布

阅读量5.8k

点赞数 3

分类专栏： css 文章标签： css

本文链接：https://blog.csdn.net/GreyBearChao/article/details/78637226

版权

css 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

none：在这种情况下，如果没有设定背景图片，border-width 计算后的值将是 0，即使先前已经指定过它的值。在单元格边框重叠情况下，none 值优先级最低，意味着如果存在其他的重叠边框，则会显示为那个边框。

hidden : 在这种情况下，如果没有设定背景图片，border-width 计算后的值将是 0，即使先前已经指定过它的值。在单元格边框重叠情况下，hidden 值优先级最高，意味着如果存在其他的重叠边框，边框不会显示。

例：

<style>
table{
    margin: 100px 100px;
    border: 1px none skyblue;/*border: 1px hidden skyblue*/
    border-collapse: collapse;/*相邻边被合并*/
}
td{
    border: 1px solid pink;
    width: 100px;
    height: 100px;
}
</style>
<body>
    <table>
        <tr><td>111</td><td>111</td><td>111</td><td>111</td></tr>
    </table>
</body>