1. 程式人生 > >css背景屬性整理

css背景屬性整理

背景顏色 {background-color:red}/*常用十六進位制顏色#fff*/

圖片 {background-image:url();} /*插入圖片路徑*/

重複 {background-repeat: no-repeat;}/*設定背景圖片不重複*/

滾動 {background-attachment: fixed;}(固定) scroll;(滾動--預設的)

 

位置 {background-position ;}四種定位方式 

  1單詞定位方式:left center right / top center bottom 可以理解為一個九宮格

left top top center right top
left center center center right center
left bottom bottom center right bottom

  2畫素定位方式:background-position:10px 50px;  距離左邊10畫素,距離上邊50畫素 只有這一種離左離上的規則

  3百分比方式:background-position:10% 20%; 距離左邊百分之十,距離上邊百分之二十

  4混合方式:background-position:left 100px; 靠左 距離上邊100px

簡寫方法 {background:#000 url(..) repeat fixed left top;} /*按照這個順序先顏色 圖片 平鋪 定位 固定*/