网页设计css设置多重背景只显示一个怎么办

html-css029

网页设计css设置多重背景只显示一个怎么办,第1张

网页设计css设置多重背景只显示一个检查下浏览器是否支持。

1、网页设计css设置多重背景只显示一个检查下浏览器是否支，首先，多重背景属于CSS3的范畴，请先确定浏览器及其版本是否支持。

2、然如果写在前面的背景图尺寸比其他的图片大，会发生遮挡，需调整背景图的顺序。

借助CSS3选择器:nth-child(2n+1)即可

<style>

.list li:nth-child(2n+1) {

background: #39f

}

</style>

<ul class="list">

<li>《HTML5布局之路》</li>

<li>CSS3</li>

<li>特殊选择器</li>

<li>:nth-child()</li>

</ul>

html里如何给一个div设置多个背景图片，需要用到才CSS3新特性

CSS3 允许您为元素使用多个背景图像。

例如：为id为pic的div 元素设置两幅背景图片：

#pic

{

background-image:url(bg_flower.gif),url(bg_flower_2.gif)

}

上面的例子就是用两种图片为div元素设置背景。

CSS3 包含多个新的背景属性，它们提供了对背景更强大的控制。

background-clip 规定背景的绘制区域。

background-origin 规定背景图片的定位区域。

background-size 规定背景图片的尺寸。