雖然CSS3帶來了許多新的背景屬性,但有些常用的屬性并不是CSS3新增的。接下來我們來一一了解。
/* 設置背景顏色 */ background-color: #000; /* 設置背景圖片 */ background-image: url('image.jpg'); /* 設置背景重復方式 */ background-repeat: no-repeat; /* 設置背景定位 */ background-position: center;
這些屬性在CSS2中已經存在了,并且在CSS3中都得到了繼續支持。所以即便CSS3帶來了許多新的背景屬性,但我們還是需要掌握這些常用的基礎屬性。
再來看一個例子:
/* 設置背景為紅色 */ background-color: red; /* 把圖片作為背景平鋪 */ background-image: url('image.jpg'); background-repeat: repeat; /* 把背景定位到右下角 */ background-position: right bottom;
這段代碼中,我們先設置背景顏色為紅色,然后把圖片作為背景并重復平鋪,最后把背景定位到右下角。
總之,雖然CSS3新增了許多背景屬性,但我們還是需要掌握基礎的背景屬性,因為它們在實際開發中仍然是非常重要的。