边框可以弄两种颜色吗?里一层外一层
时间: 2024-03-07 20:46:36 浏览: 11
是的,你可以通过使用伪元素 `::before` 和 `::after` 来实现 fieldset 元素的双层边框。具体的代码如下:
```css
fieldset {
position: relative;
padding: 0;
border: none;
}
fieldset::before {
content: '';
position: absolute;
top: 2px;
left: 2px;
right: 2px;
bottom: 2px;
border: 2px solid #000000;
}
fieldset::after {
content: '';
position: absolute;
top: 4px;
left: 4px;
right: 4px;
bottom: 4px;
border: 2px solid #ffffff;
}
```
上面的代码中,我们首先将 fieldset 元素的 padding 和 border 属性都设置为了 0,然后使用伪元素 `::before` 和 `::after` 来创建两个边框。
`::before` 伪元素的样式设置了一个 2px 的黑色实线边框,并绝对定位在 fieldset 元素的内部,距离 fieldset 边框的距离为 2px。
`::after` 伪元素的样式设置了一个 2px 的白色实线边框,并绝对定位在 `::before` 伪元素的内部,距离 `::before` 边框的距离为 2px,这样就形成了一个双层边框的效果。