在CSS中,background是一個非常有用的屬性。通過background屬性,我們可以為HTML元素添加背景顏色、背景圖片或背景圖案,進而美化頁面的顯示效果。
/*設置元素的背景顏色*/ background-color: red; /*設置元素的背景圖片*/ background-image: url('example.jpg'); /*同時設置背景顏色和背景圖片*/ background: #fff url('example.jpg') no-repeat; /*設置背景圖案(圖案通常很小,均勻平鋪,類似墻紙效果)*/ background-repeat: repeat; /*默認*/ background-repeat: repeat-x; /*水平方向重復*/ background-repeat: repeat-y; /*垂直方向重復*/ background-repeat: no-repeat; /*不重復*/ /*設置背景圖片的位置*/ background-position: left top; /*默認*/ background-position: right bottom; background-position: center center; /*固定背景圖片,不隨頁面滾動*/ background-attachment: scroll; /*默認*/ background-attachment: fixed; /*設置背景圖片的尺寸*/ background-size: auto; /*默認*/ background-size: contain; /*圖片完整顯示在元素內部,可能有空白*/ background-size: cover; /*圖片覆蓋整個元素,可能被裁切*/
通過上述CSS代碼,我們可以輕松地實現(xiàn)各種背景效果,為網(wǎng)頁增色不少。