Background-rgba无法在简单代码段上运行？

Question

现在已经尝试了半个小时，但我仍然不明白为什么这样一个简单的代码片段不会具有背景色：

#section3 {
  z-index: 5;
  overflow: hidden;
  width: 100%;
  height: auto;
  background-color: rgba(0, 0, 0, 1);
}

h3 {
  position: relative;
  text-align: center;
  margin-top: 10vh;
  font-size: 2em;
}

<span id="section3">
    <h3>Unser Anspruch</h3>
</span>

JSFiddle

Answer 1

span是一个内联块元素，因此无法指定高度

要赋予高度，您必须将其转换为display:block或display:inline block

但是正如@LGSon所说，h3绝不能放在span元素内

使用span是div，而不要使用div  默认情况下

display:block

#section3 {
    z-index: 5;
    overflow: hidden;
    width: 100%;
    height: auto;
    background-color: rgba(250,0,0,1);
   }

h3{

    position: relative;
    text-align: center;
    margin-top:10vh;
    font-size: 2em;

}