Question

我试图在页面中制作一个无内容的div节目：

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

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

  &:before {
    content: ' '
  }
}

我认为content: ' '会成功...但div只显示我做content: 'content'之类的事情。但是，我不想展示任何内容。

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

Answer 1

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

Answer 2

如果您正在寻找，请在div中添加<br/>个分隔线以创建空间。否则固定高度应该有效..

Answer 3

只需在div

中添加＆amp; nsbp; 即可像这样：

<div class="modal-border">&nbsp;</div>

Answer 4

对于您的内容，只需添加unicode \00a0，这是一个不间断的空间。所以，

div::before { content: "\00a0"; }请注意，它是两个冒号。

您不需要高度属性，也可能不需要宽度属性。如果您想设置宽度，则需要display:inline-block;或block到::before属性。

确保在<head>

中指定UTF-8

<meta charset="UTF-8">