修改 CSS DIV 區塊背景顏色

修改 CSS DIV 區塊背景顏色的方式很簡單，CSS 內建的 background-color 屬性就是設定網頁元素背景顏色的標準屬性，我們可以將這個屬性套用到 DIV 區塊內，就能夠輕易的調整 DIV 區塊背景顏色，每個 DIV 區塊只需要使用一次 background-color 即可，接著套用背景顏色的英文名稱或色碼，馬上就可以改變 DIV 區塊的背景顏色，先來看看這個 background-color 屬性的基本語法。

background-color 屬性的語法
background-color: 顏色設定;
語法中的＂顏色設定＂為網頁設計師自己決定的顏色，能夠使用顏色英文單字，例如藍色就用 blue、紅色就用 red ... 以此類推，也可以使用十六進位色碼或是 RGB 色碼，其中又以十六進位色碼最常使用，因為變化相當廣泛，且可以在色馬表上快速查詢，若您要查詢色碼表，可以利用 Wibibi 所提供的《色碼表》進行查詢。

關於 background-color 屬性的詳細用法，請參閱：CSS background-color 背景顏色。

修改 CSS DIV 區塊背景顏色的範例
<div style="background-color:blue;border:2px black solid;padding:10px;">這是藍色的背景顏色</div>
<div style="background-color:orange;border:2px black solid;padding:10px;">這是橘色的背景顏色</div>
<div style="background-color:#00F000;border:2px black solid;padding:10px;">這是 #00F000 的背景顏色</div>
範例的輸出效果
這是藍色的背景顏色
這是橘色的背景顏色
這是 #00F000 的背景顏色
我們總共有三個不同背景顏色的 DIV 區塊，前面兩個分別透過顏色英文單字將背景顏色設定為藍色以及橘色，第三個 DIV 區塊則是使用十六進位的色碼來表示，修改 CSS DIV 區塊背景顏色的方法就是這麼簡單，要什麼樣的顏色就循著這樣的技巧自己設計吧！

調整 DIV 區塊背景顏色沒問題的話，可以進一步研究：增加 CSS DIV 區塊背景圖片。

延伸閱讀
© Copyright webtech.tw Since 2010