对于一个网站,我试图让容器前的元素以与容器后面的元素不同的颜色显示.我想得到以下结果:
我试过这个:CSS:之前:在背景颜色之后.还有很多其他的东西,但这一切都没有成功.我最终得到以下代码:
.section {
width: 100%;
}
.section .container {
background-color: #fff;
width: 250px;
margin: 0 auto;
text-align: center;
}
.section .container::before {
background-color: red;
content: ' ';
}
.section .container::after {
background-color: blue;
content: ' ';
}
.section .container h1 {
padding: 10px;
}Run Code Online (Sandbox Code Playgroud)
<div class="section">
<div class="container">
<h1>Hello world.</h1>
</div>
</div>Run Code Online (Sandbox Code Playgroud)
结果只是白色.