下面是一个简单的示例代码,可以制作出磨砂透明效果:
.background { background-color: rgba(0,0,0,0.5); /* 设置半透明背景 */ position: relative; /* 设置相对定位 */ } .background::before { content: ""; /* 添加空内容 */ position: absolute; /* 设置绝对定位 */ top: 0; left: 0; right: 0; bottom: 0; background-image: url(磨砂图片的路径); /* 添加磨砂图片背景 */ opacity: 0.3; /* 设置透明度 */ }
将上述代码应用于一个具有 background
类的元素上,就可以在背景上显示磨砂透明效果,并可以通过调整透明度和磨砂图片的路径来自定义效果。