CSS3是當前最流行的前端技術之一,在網頁制作中使用得非常廣泛。而CSS3背景制作是其一個重要的應用,下面將介紹如何利用CSS3來創建各種不同樣式的背景。
1. 純色背景
body { background-color:#f1f1f1; }
這種背景主要是使用顏色代碼來設置,可以根據需求設置不同顏色值。
2. 漸變背景
body { background: linear-gradient(to bottom, #f1f1f1, #ddd); }
該屬性可以實現從上到下或者從左到右漸變效果。
3. 背景圖像
body { background-image: url('image.png'); background-repeat: no-repeat; background-size: cover; }
這種背景需要使用背景圖片,可以采用各種格式的圖片,并使用背景大小屬性控制圖片大小。
4. 塊級背景圖像
div { background-image: url('image.png'); background-repeat: no-repeat; background-size: cover; }
該屬性主要是針對某個塊級元素而非整個頁面,可以為不同的容器設置不同的背景圖片。
本文介紹了CSS3背景制作的基礎常識和四種常見制作方法,當然,還有很多其他不同的背景制作方法可以實現特定的效果,探索它們將讓您在網頁制作中更加得心應手。
上一篇css3背景圖輪播圖
下一篇css3背景定位