WEB开发网
开发学院网页设计DivCss CSS3网页制作技巧:css3多重背景 阅读

CSS3网页制作技巧:css3多重背景

 2012-03-27 10:12:35 来源:WEB开发网   
核心提示: 对于background不必多做解释了,如果不了解的可以单独论坛发帖,CSS3网页制作技巧:css3多重背景,css3以下版本的background只能单独对一张图片进行背景设置、平铺方式、背景位置,而在css3赋予了它更大的权利,同样它也分开来写:background-image:url(images/weathe

 对于background不必多做解释了,如果不了解的可以单独论坛发帖。

css3以下版本的background只能单独对一张图片进行背景设置、平铺方式、背景位置。而在css3赋予了它更大的权利,可以设置更多背景图片,这就是今天要说的css3多重背景。
多重背景语法:background:背景,背景,背景;
 
background: url(images/weather-cloud.png) center center no-repeat, url(images/weather-clouds.png) top left no-repeat, url(images/weather-cloudy.png) top right no-repeat, url(images/weather-rain.png) bottom left no-repeat,url(images/weather-snow.png) bottom right no-repeat;
 
 
这种也是由css2中的background升级过来,只不过支持了多重背景。同样它也分开来写:
background-image:url(images/weather-cloud.png),url(images/weather-clouds.png),url(images/weather-cloudy.png),url(images/weather-rain.png),url(images/weather-snow.png);  
background-repeat: no-repeat;  
background-position:center center,top left,top right,bottom left,bottom right; 
 
 
切记:image调用几个,如果不共用其他属性,必须分别写出属性。
 

Tags:CSS 网页制作 技巧

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接