如何解决有没有一种方法可以对颜色和SVG进行分层以制作背景
是否可以具有背景色,然后在其前面具有SVG文件,然后在其前面具有不透明的另一层?我试图为网站的背景做一个很酷的效果。预先感谢!
解决方法
为此,您可以使用z-index
。
这应该可行,在here
<body class='main'>
Hello
<img src="https://upload.wikimedia.org/wikipedia/commons/1/17/Yin_yang.svg" />
<div class='overlay'></div>
</body>
<style>
body{
background-color:#424242;
background-size: 'cover'
}
/*overlay styling,source: https://www.w3schools.com/howto/howto_css_overlay.asp */
.overlay{
position: fixed; /* Sit on top of the page content */
width: 100%; /* Full width (cover the whole page) */
height: 100%; /* Full height (cover the whole page) */
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(4,0.5); /* Black background with opacity */
z-index: 2;
}
</style>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。