如何让伪元素里的背景色不遮住元素本身的内容
写了一个header header设置了背景图片 而且、header里面有内容 给header设置了一个伪元素目的是让header的背景图片上覆盖一层有透明度的颜色 但是加了伪元素之后发现header里的内容被伪元素的透明度的颜色遮住了
怎那样才能不让内容被伪元素遮住
PS：效果图传了N便都传不上来QAQ
李下之忌心中郁浏览 5404回答 2
2回答
-
woshiajuana
z-index 想起作用的话，需要把元素设置成定位元素 -
脑阔疼
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> .test{ width: 100px; height: 100px; background:#f00; margin: 100px auto; } .test::after{ content: ""; display: block; width: 100px; height: 100px; background-color: #00f; opacity: 0.6; } </style> </head> <body> <div class="test"> 12312123 </div> </body></html>亲测可行啊~你是不是因为0.85效果不明显看不出来
随时随地看视频慕课网APP
CSS3
Html/CSS