admin 发表于 2018-2-7 12:26:25

给 background-image 设置透明度!

div{
    position: relative;      
}
div:after{
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: url(...);
    opacity: 0.5;
}

admin 发表于 2021-11-12 18:47:09

背景图片如何渲染颜色与透明度

渐变色:
background-image: linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.1)), url(../img/glow.jpg);

变黑底:
background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(../img/glow.jpg);

变白底:
background-image: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(../img/glow.jpg);

页: [1]
查看完整版本: 给 background-image 设置透明度!