杂色的背景,CSS中如何写

html-css030

杂色的背景,CSS中如何写,第1张

什么叫杂色的背景?

楼主请附图

如果是有这样规则渐变背景(如上图),可用一段背景图片平铺而成

也可以用css3最新渐变背景样式(当然考虑到兼容性),代码如下

.gradient{

width:300px

height:150px

filter:alpha(opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150) progid:DXImageTransform.Microsoft.gradient(startcolorstr=red,endcolorstr=blue,gradientType=0)

-ms-filter:alpha(opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150) progid:DXImageTransform.Microsoft.gradient(startcolorstr=red,endcolorstr=blue,gradientType=0)/*IE8*/

background:red /* 一些不支持背景渐变的浏览器 */

background:-moz-linear-gradient(top, red, rgba(0, 0, 255, 0.5))

background:-webkit-gradient(linear, 0 0, 0 bottom, from(#ff0000), to(rgba(0, 0, 255, 0.5)))

background:-o-linear-gradient(top, red, rgba(0, 0, 255, 0.5))

}

<div class="gradient"></div>

如果没有规律只能用背景图片方法了

background:url(bg.jpg) no-repead

已经用css定义了背景,添加图片使图片颜色与背景颜色一致,首先颜色,先确定好一种颜色,做为最终的颜色,修改图片的背景图片,可以去使用ps将背景颜色去掉,添加确定好的颜色,或者在是在css中修改背景颜色也是可以,具体看代码:

<html>

<head>

<style>

#div1{

width:960px

height:200px

background-color:#f00

background:url('图片地址')

}

</style>

</head>

<body>

<div id='div1'>

<p>我是测试文字</p>

</div>

</body>

</html>