：在伪元素出现之前

Question

我无法显示:before伪元素。我想在有问题的<h2>元素后面创建一个形状。

http://jsfiddle.net/cbeLanvb/2/

<div id="container">
<h2 id="info_text_startday_explain">turmas começam</h2>
<h1 id="info_text_startday">10 de Maio</h1>
</div>

CSS

#container{
height: auto;
width: 300px;
background-color: red;
}

#info_text_startday_explain{
display: inline-block;
width: 100%;
text-align: center;
margin: 0 auto;
font-size: 2em;
color: black;
}
#info_text_startday{
position: relative;
z-index: 3;
color: white;
font-size: 2.8em;
}

#info_text_starday:before{
position: absolute;
content: '';
z-index: 2;
background-color: black;
border: 3px solid white;
height: 300px;
width: 290px;   
}

Answer 1

CSS中有拼写错误 ..

id的{​​{1}}为div，而您的css中info_text_startday

所以在你的CSS中替换为

#info_text_starday:before

请参阅fiddle