html – CSS：结合纹理和颜色

发布时间：2020-12-14 19:42:07 所属栏目：资源来源：网络整理

导读：有人如何将纹理用作背景图像和背景颜色组合在纹理上方？这里的纹理：我希望我的身体背景页面如下：我正在努力使用backroung-image和background-color：http://jsfiddle.net/87K72/ body{ background: #6DB3F2 url('http://s13.postimg.org/j0qiscsw3/crea

有人如何将纹理用作背景图像和背景颜色组合在纹理上方？

这里的纹理：

我希望我的身体背景页面如下：

我正在努力使用backroung-image和background-color：http://jsfiddle.net/87K72/

body{
  background: #6DB3F2 url('http://s13.postimg.org/j0qiscsw3/cream.png');
 }

解决方法

您可以在身体顶部使用带有Alpha通道的叠加div,但在其他元素下使用.

jsFiddle example

<h1>I want blue color above my texture</h1>
<div id="cover"></div>
body {
    background: url('http://i.stack.imgur.com/oslRB.png');
}
h1{
    position:relative;
    z-index:2;
}
#cover {
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    background-color:rgba(109,179,242,0.5);
    z-index:1;
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!