Html 如何通过css或css3在一个div标记上创建两个边界？

我正在为我的客户开发一个html/css模板。这里有一个类名称为：single\u post\u box的post div。 在这个部门，斯莱尔就像贝娄一样：

single_post_box{
border: 1px solid #eaeaea;
}

现在我的客户想要，有两个边界。第一个边框颜色将：#eaeaea，第二个边框颜色将：#dddddd。

---

我怎样才能做到这一点。

好吧，您可以添加以下内容以获得相同的效果

div{
边框：1px红色虚线；
轮廓：3倍蓝色虚线；
}

---

这是我

您可以添加以下内容以获得相同的效果

div{
边框：1px红色虚线；
轮廓：3倍蓝色虚线；
}

---

这是我

您可以使用伪元素来实现

.double {
    background-color: #ccc;
    border: 4px solid #fff;
    padding: 20px;
    width: 200px;
    height: 300px;
    position: relative;
}
.double:before {
    background: none;
    border: 4px solid #666;
    content: "";
    display: block;
    position: absolute;
    top: 4px;
    left: 4px;
    right: 4px;
    bottom: 4px;
}

---

您可以检查这个答案

您可以使用伪元素进行检查

.double {
    background-color: #ccc;
    border: 4px solid #fff;
    padding: 20px;
    width: 200px;
    height: 300px;
    position: relative;
}
.double:before {
    background: none;
    border: 4px solid #666;
    content: "";
    display: block;
    position: absolute;
    top: 4px;
    left: 4px;
    right: 4px;
    bottom: 4px;
}

---

你可以检查这个答案，只要把这个加入你的风格，我想你想要一个不同颜色的div

box-shadow: red 0px 0px 0px 2px, green 0px 0px 0px 4px;

---

把这个加在你的风格上，我想你想要一个不同颜色的沙发

box-shadow: red 0px 0px 0px 2px, green 0px 0px 0px 4px;

---

使用

box shadow

和

border

组合使用

box shadow

和

border

多亏了u。我明白了，多亏了你。我得到了它。