如何通过CSS创建双边框

Question

如何使用CSS这样做？特别是双边框（不使用border：double;） PS：演示的HTML代码：.... 1801180218031804 ...

Answer 1

您基本上使用嵌套，这意味着父容器（.container）具有边框，子元素（.childdiv）具有边框。 html（对于单个单元格）看起来像这样：

.container,
.childdiv {
  padding: 20px;
  border: 1px solid black;
}

.container {
  display: inline-block;
  width: 70px;
}

.childdiv {
  display: inline-block;
  width: 30px;
}

<div class="container">
  <div class="childdiv">

  </div>
</div>

查看fiddle是否有工作演示。

Answer 2

试试这个：

＆＃13;

＆＃13;

div {
    border:1px solid #ccc;
    padding: 10px;
    display: inline-block;
}

div:before {
    content: attr(data);
    display: inline-block;
    border:1px solid #ccc;
    padding: 10px;
}

＆＃13;

<div data="1898"></div>

＆＃13;

＆＃13;

＆＃13;