1

我正在尝试使用带有浅色的边框插图作为插图，但是，选择的颜色根本没有正确显示，这在每个浏览器中都是一样的

这是 css - 第一个盒子应该有浅色的嵌入边框，第二个盒子应该稍微暗一些：

这里有一个小提琴：CSS inset border Fiddle

.box1 {
display: inline-block;
border: 4px inset #f7f7f7;
margin-top: 16px; 
border-radius: 12px;
height: 34px;
background:#fff;
width:230px;
position:relative;
padding:10px;
}

.box2 {
display: inline-block;
border: 4px inset #cccccc;
margin-top: 16px;
border-radius: 12px;
height: 34px;
background:#f7f7f7;
width:230px;
position:relative;
padding:10px;
}

我尝试单独设置边框颜色元素，但没有区别

非常奇怪的行为？

4

1 回答 1

1

这就是规范中插入边框的工作方式（http://www.w3.org/TR/CSS2/box.html#border-style-properties）。底部和右侧比顶部和左侧轻；后两者是设定的颜色。有关所有边框选项，请参阅https://developer.mozilla.org/en-US/docs/Web/CSS/border-style。

于 2012-12-28T16:28:42.117 回答