css - 边框:开始；只能在火狐浏览器中工作

Question

我有一张 table this page使用以下 css(每个 td 都有类 box)

.box{
    border: 3px outset #959595;
    width:25px;
    height: 25px;
    background-color: #dddddd;
    cursor: pointer;
}

table{
    border-collapse: collapse;
    border-spacing: 0px;
    border: 4px inset #444;
}

我在 Firefox 中得到了我想要的

但在任何其他浏览器中它似乎都没有按照我想要的方式工作

Answer 1

来自MDN's documentation on border-style (回复:outset):

Displays a border that makes the box appear in 3D, embossed. It is the opposite of inset. When applied to a table cell with border-collapse set to collapsed, this value behaves like ridge.

您的 table 有border-collapse: collapse; ，所以它实际上渲染为 border-style: ridge在火狐浏览器中。

任意设置border-collapse: separate;或设置border-style: ridge;跨浏览器标准化可能不会改变的样式 outset至ridge .