开发者社区> 问答> 正文

怎样让background-color在background-img的上边显示呢?

想给这个div的背景图上加一个遮罩层,但是设置之后background-color总是在背景图之下怎样解决呢?
screenshot

展开
收起
杨冬芳 2016-06-08 16:32:58 2906 0
1 条回答
写回答
取消 提交回答
  • IT从业

    如果兼容性要求不高,有另一个可选的思路,是使用渐变和多重背景图。因为渐变色gradient也属于background-image,所以题主想要纯色的遮罩,就可以这样写:

    background-image: 
    linear-gradient(rgba(0, 0, 0, .7), rgba(0, 0, 0, .7)),
    url(../images/home-bg.jpg);
    

    在多重背景的时候,写在前边的位于上方。

    gradient的浏览器要求:http://caniuse.com/#search=gradients
    multibackgrounds的浏览器要求:http://caniuse.com/#feat=multibackgrounds
    2019-07-17 19:32:17
    赞同 展开评论 打赏
问答地址:
问答排行榜
最热
最新

相关电子书

更多
Orange-Is-The-New-Purple 立即下载
orange is the new purple 立即下载
Transforming the data center 立即下载