html - 将哪些不可见的内容添加到 div 以使其显示在页面中？

Question

我正在尝试在页面中显示无内容的 div:

<div class="modal-border"></div>

.modal-border {
  background-color: $primary-color
  width: 5px
  height: 100%

  &:before {
    content: ' '
  }
}

我认为 content: ' ' 会成功...但只有当我执行类似 content: 'content' 的操作时才会显示 div。但是，我不想显示任何内容。

处理这个问题的最佳方法是什么？

Answer 1

它需要一个定义的高度和宽度才能显示。如果高度是百分比，则它需要一个具有已定义高度的父元素。