css3 背景圖片(背景大小和多背景圖)

CSS3的背景圖片大小能夠寫成 background-size:Apx Bpx;
-Apx = x軸(圖片寬度)
-Bpx = y軸(圖片高度) css

瞭解了這些,咱們開始體驗這個特性吧:
最好支持CSS3背景大小的瀏覽器是Safari和Opera,因此咱們只須要使用-o和-webkit前綴。 web

#backgroundSize{
	border: 5px solid #bd9ec4;
	background:url(image_1.extention) bottom right no-repeat;
	-o-background-size: 150px 250px;
	-webkit-background-size: 150px 250px;
	padding: 15px 25px;
	height: inherit;
	width: 590px;
}

爲了在CSS3中應用多背景圖片,咱們使用都好隔開,例如: 瀏覽器

background: url(image_1.extention) top right no-repeat, url(image_2.extention) bottom right no-repeat; url

#backgroundMultiple{
	border: 5px solid #9e9aab;
	background:url(image_1.extention) top left no-repeat,
	url(image_2.extention) bottom left no-repeat,
	url(image_3.extention) bottom right no-repeat;
	padding: 15px 25px;
	height: inherit;
	width: 590px;
}
相關文章
相關標籤/搜索