如何为带有伪元素的子 Div 创建边框叠加？

创建边框叠加子div

要为子div创建边框叠加效果，可以考虑使用伪元素。这种方法有几个优点：

• 避免需要额外的标记。
• 增强对边框位置和大小的控制。

实现示例:

body {
  background: grey;
}

.button {
  background: #94c120;
  width: 200px;
  height: 50px;
  margin: 50px;
  position: relative;
}

.button:before {
  content: "";
  position: absolute;
  top: -15px;
  left: -15px;
  width: 100%;
  height: 100%;
  border: 5px solid #fff;
  box-sizing: border-box;
}

<div class="button">
  some text
</div>

以上是如何为带有伪元素的子 Div 创建边框叠加？的详细内容。更多信息请关注PHP中文网其他相关文章！