所以我想添加一个不透明度为 16% 的背景，它实际上可以工作现在看起来像 我想要的样子
当前代码：
#main-top {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
flex-wrap: wrap;
margin-bottom: 1em;
padding-bottom: 4em;
text-align: center;
clip-path: polygon(50% 0%, 100% 0, 100% 65%, 50% 100%, 0 65%, 0 0) !important;
/*background-color: rgba(37, 170, 231, 0.904);*/
background-color: var(--primary-color);
}<div id="main-top">
<div id="sosa">
<h2>Birds</h2>
</div>你可以这样做：
#main-top {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
flex-wrap: wrap;
margin-bottom: 1em;
padding-bottom: 4em;
text-align: center;
clip-path: polygon(50% 0%, 100% 0, 100% 65%, 50% 100%, 0 65%, 0 0) !important;
/*background-color: rgba(37, 170, 231, 0.904);*/
background-color: blue;
position: relative;
}
#main-top::after {
position: absolute;
content: '';
background: url(https://placekitten.com/640/560) no-repeat center center;
background-size: cover;
width: 100%;
height: 100%;
z-index: 99;
opacity: 0.4;
top: 0;
}<div id="main-top">
<div id="sosa">
<h2>Birds</h2>
</div>
</div>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句