關(guān)于css 的 background 屬性
background屬性可以用來一次性設置以下屬性:
- background-clip: 設置該元素背景的邊緣范圍(border-box , padding-box, content-box , etc)
- background-color: 背景顏色
- background-image: 背景圖片
- background-origin: 背景相對位置的起始點(border-box, padding-box, content-box, etc)
- background-position: 背景的相對位置（相對于起始點）
- background-repeat: 背景圖片的重復方式
- 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
