189 8069 5689
1 做个 红线灰线效果的图片
成都创新互联专注于太康企业网站建设,响应式网站开发,商城网站建设。太康网站建设公司,为太康等地区提供建站服务。全流程按需求定制设计，专业设计，全程项目跟踪，成都创新互联专业和态度为您提供的服务
2 css 的属性 调用
background:url(图文件名) no-repeat
上下渐变的图片做背景在背景重复的时候有明显的过渡不平滑，除非将图片设置css样式background: fixed;让背景不动。
其实可以这样，你将背景图片设置高一点，大概300像素-400像素高度左右，然后以渐变图片最下面的颜色为背景色，这样就可以无限背景平铺下去。
可以有多种方法实现的。比如可以给每个img设置不同的ID：
img id=p1 src="1.jpg"/img id=p2 src="2.jpg"/img id=p3 src="3.jpg"/
style
#p1 {border:1px solid #f00}
#p2 {border:1px solid #0f0}
#p3 {border:1px solid #00f}
/style
或者是不同的class：
img class=p1 src="1.jpg"/img class=p2 src="2.jpg"/img class=p3 src="3.jpg"/
style
.p1 {border:1px solid #f00}
.p2 {border:1px solid #0f0}
.p3 {border:1px solid #00f}
/style
还有一种更灵活的方式，但需要浏览器支持css3：
img src="1.jpg"/img src="2.jpg"/img src="3.jpg"/
style
img:nth-of-type(1) {border:1px solid #f00}
img:nth-of-type(2) {border:1px solid #0f0}
img:nth-of-type(3) {border:1px solid #00f}
/style
这种方法还有多种灵活的处理方式，比如：
img:nth-of-type(odd) 会选择所有单数的图片（第1张、第3张、第5张……）
img:nth-of-type(even) 会选择所有双数的图片（第2张、第4张、第6张……）
img:nth-of-type(2n) 也是选择双数
img:nth-of-type(2n+1) 也是选择单数
img:nth-of-type(3n+1) 从第1张算起每3张取出1张图片（第1张、第4张、第7张……）
img:nth-of-type(5n+3) 从第3张算起每5张取出1张图片（第3张、第8张、第13张……）
除了这个，css还有几十种不同的选择器，你百度搜一下 css选择器 就知道了。
1、如果想改变css背景图片，一般的做法只能使用css滤镜；
2、css滤镜主要包括：
Speia滤镜 灰度图滤镜 高斯模糊滤镜 反色滤镜 饱和度滤镜
对比度滤镜 亮度滤镜 色相旋转滤镜 阴影滤镜
3、css滤镜在浏览器兼容是比较坑爹的问题，ie浏览器有自己一套滤镜filter家族，基本所有ie内核浏览器都支持，ff和Chrome，opera则主要使用css3的滤镜，这些浏览器在后期版本支持css3的滤镜（目前版本基本都支持html5和css3），通过滤镜改变背景图的颜色和效果，当然这些滤镜主要是为了效果而产生，颜色只是固定的几种效果。
4、个别时候，css滤镜还需要结合js使用，才能到达必要效果，其实一般背景图片都是用透明度的css来设置它的颜色度；
透明度css列子：
transparent_class {
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
}