CSS3 multiple background-image多背景图之间的层叠关系

浏览器参照基准:Firefox3.6 and Later, Chrome5 and Later, Safari5 and Later, Opera11.50 and Later, IE9.0 and Later

多组背景图multiple background-image的层叠关系效果演示:

#background-image{
	background:
		url(../../pimg/p_103x196_1.jpg) no-repeat,
		url(../../pimg/p_103x196_2.jpg) no-repeat 25px 25px,
		url(../../pimg/p_103x196_3.jpg) no-repeat 50px 50px,
		url(../../pimg/p_103x196_4.jpg) no-repeat 75px 75px,
		url(../../pimg/p_103x196_5.jpg) no-repeat 100px 100px;
}

如果设置的多重背景图之间存在着交集(即存在着重叠关系),前面的背景图会覆盖在后面的背景图之上。效果如上例所示

CSS探索之旅