html - 如何在 css3 渐变效果下添加不透明度低的背景图像

Question

我的 photoshop 设计有渐变颜色，有 64 不透明度，它有图案我已经成功地做渐变和降低不透明度就像我在主题中的代码示例但我的问题是我如何可以添加图案

display: block;
position: relative;
width:100%;
height:100%;
background: rgba(137,206,157,1);
background: -moz-linear-gradient(top, rgba(137,206,157,1) 0%, rgba(74,187,154,0.64) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(137,206,157,1)), color-stop(100%, rgba(74,187,154,0.64)));
background: -webkit-linear-gradient(top, rgba(137,206,157,1) 0%, rgba(74,187,154,0.64) 100%);
background: -o-linear-gradient(top, rgba(137,206,157,1) 0%, rgba(74,187,154,0.64) 100%);
background: -ms-linear-gradient(top, rgba(137,206,157,1) 0%, rgba(74,187,154,0.64) 100%);
background: linear-gradient(to bottom, rgba(137,206,157,1) 0%, rgba(74,187,154,0.64) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#89ce9d', endColorstr='#4abb9a', GradientType=0 );

Answer 1

1) #your box {
background-image: url('XX.gif');
/* here your code /*
}

2) 
<div id="box">
<div id="your_box">
</div>
</div>


#box {
background-image: url('XX.gif'); /* or put here a css3 grandient effect instead
background-color: #XY;
display: block;
position: relative;
width:100%;
height:100%;
overflow:hidden;
}

#box #your_box {
here your code
}