为什么这个css不显示我的背景？

Question

为什么此代码对HTML没有影响？

.main {
      height: 100%;
     }
.main::before {
      content:"";
      display: block;
      background: url(https://dummyimage.com/600x400/000/fff) no-repeat 30% 0;
     }

<div class="main"></div> 

Answer 1

main::before没有内容，也没有可以使其高度为非零的CSS。因此，它不提供可以在其上绘制背景的像素。