CSS的背景顏色是WEB前端開發中最基礎的一種樣式設置,它可以用來突出頁面內容,也可以用來修飾頁面布局。在CSS中,背景顏色可以通過多種方式進行設置,下面將介紹其中的一些。
/* 直接設置背景顏色 */ body { background-color: #E6E6FA; } /* 設置背景圖片 */ body { background-image: url("bg.jpg"); } /* 設置背景圖片平鋪方式 */ body { background-repeat: no-repeat; /* 默認 */ background-repeat: repeat-x; /* 水平平鋪 */ background-repeat: repeat-y; /* 垂直平鋪 */ background-repeat: repeat; /* 水平和垂直平鋪 */ } /* 設置背景圖片位置 */ body { background-position: left top; /* 左上方 */ background-position: center center; /* 居中 */ background-position: right bottom; /* 右下方 */ } /* 設置背景圖片固定位置 */ body { background-attachment: scroll; /* 默認 */ background-attachment: fixed; /* 固定在視窗中 */ } /* 設置背景顏色、圖片、重復方式、位置、固定位置等屬性 */ body { background: #E6E6FA url("bg.jpg") no-repeat center center fixed; }
除了以上常見的設置方式,還可以利用CSS3中的一些新特性來設置背景顏色,比如漸變色和圖案等。總的來說,CSS的背景顏色并不復雜,但是掌握好它的用法可以快速提升頁面的美觀度。
下一篇vue自定義模板