關(guān)于css 的 background 屬性

background屬性可以用來一次性設(shè)置以下屬性:

• background-clip: 設(shè)置該元素背景的邊緣范圍(border-box , padding-box, content-box , etc)
• background-color: 背景顏色
• background-image: 背景圖片
• background-origin: 背景相對位置的起始點(border-box, padding-box, content-box, etc)
• background-position: 背景的相對位置（相對于起始點）
• background-repeat: 背景圖片的重復(fù)方式
• background-size: 背景圖片的尺寸
• background-attachment: 調(diào)整背景圖片可滾動/固定

background相關(guān)的屬性一般使用起來比較簡單，不會做過多的組合；可以通過MDN上的實時示例了解具體效果

Example

HTML

<p class="topbanner">
 Starry sky<br/>
 Twinkle twinkle<br/>
 Starry sky
</p>
<p class="warning">Here is a paragraph<p>

CSS

.warning { 
  background: pink; 
}
                                                                                      
.topbanner { 
  background: url("https://mdn.mozillademos.org/files/11983/starsolid.gif") #99f repeat-y fixed; 
}

Result

image-20191121164732633