div的"内联"边框

Question

这就是我要归档的内容:

这是我的代码:

.mybox {
  width: 200px;
  height: 60px;
  background-color: #00483b;
  /* ... and other simple stuff border: THIS IS MY PROBLEM */
}

<div class="mybox">Text Inside</div>

如何在我的div周围画一个白色边框？此边框应该是框内的一些像素.我很确定我见过类似的东西,或者我错了,这是不可能的？那我该怎么办呢？

Answer 1

您可以使用outline,在法线之外绘制额外的边框border.

.mybox {
  width: 200px;
  height: 60px;
  background-color: #00483b;
  border: 1px solid white;
  outline: 3px solid #00483b;
}

<div class="mybox">Text Inside</div>