背景設(shè)置background:
1.background-color:背景顏色設(shè)置
? ?顏色單位:英語(yǔ)單詞(如:red,green祥楣,blue,white汉柒,...)误褪、十六進(jìn)制、rgb() / rgba()碾褂、hsl() / hsla()兽间、transparent;
2.background-image:url("圖片地址");背景圖片設(shè)置
3.background-repeat:repeat-x | repeat-y | no-repeat;背景平鋪設(shè)置
? ?repeat-x:橫向平鋪
? ?repeat-y:縱向漂流
? ?no-repeat:不平鋪
4.background-position:x y正塌;背景定位設(shè)置
? ?可以設(shè)置像素(支持正負(fù)數(shù))嘀略,可以設(shè)置方向和百分比(left=0%,center=50%乓诽,right=100%)
? ?例如:background-position:20px 40px; X軸方向上向右偏移20px帜羊,Y軸方向上向下偏移40px;
? ?background-position:center center鸠天;居中顯示(可以簡(jiǎn)寫為:background-position:center讼育;)
5.background-size:背景圖片尺寸設(shè)置
? ?background-size:width height | cover | contain;
? ?cover:自適應(yīng)寬高中較大尺寸鋪滿
? ?contain:自適應(yīng)寬高中較小尺寸
6.多背景稠集,多個(gè)屬性用逗號(hào)隔開
? ?如:background-color:red奶段;
? ?background-image:url("https://photo.tuchong.com/395783/g/20329210.jpg"),url("http://tse1.mm.bing.net/th?id=OIP.IbYQdbyj5ZaYJvDLgS4oYAEYEY&w=300&h=300&p=0&pid=1.7");
? ?background-repeat: repeat-x, no-repeat;
? ?background-position:0 0,100% 0;
? ?background-size: width height, | contain;
7.背景簡(jiǎn)寫形式,沒(méi)有固定順序
? ?background:background-red background-image background-repeat background-position巍杈;