一尘不染

CSS双边框,外边框比内边框厚

css

在当前的工作中,我需要在容器上产生一个双边框。边框样式:double;做到这一点,但是我的客户希望外部边界更厚,内部边界具有正常的厚度。

除了创建2个div之外,还有1个嵌套在另一个div中,外部div具有更大的厚度,或者通过使用边框图像,有什么方法可以用CSS来实现,而仅使用1
div?指定边框样式:double; 并且仍然能够使外边界更厚。


阅读 412

收藏
2020-05-16

共1个答案

一尘不染

轮廓包含在CSS3规范中,并且可以将边框和轮廓都应用于单个元素。

outline属性与border命令相同。但是,附加的offset属性允许边界在元素内部或外部进一步移动。

我使用轮廓为边框提供2种不同的颜色,更改代码以为边框提供2种不同的大小。

#box {
border: 1px double #000;
outline: 2px solid #699;
outline-offset: -9px;
}
2020-05-16