CSS DIV 背景顏色

CSS DIV 背景顏色可以透過 CSS 本身的 background-color 屬性來設計，而且不只是 DIV 背景顏色能使用，網頁中的各種元素都可以使用，因為 background-color 是 CSS 的背景顏色設計標準語法，所以主流的瀏覽器都支援。通常使用 background-color 來設計 DIV 背景顏色時，會需要使用《色碼表》來挑選不同的顏色，直接套用進去 background-color 語法參數即可，以下是幾個 CSS DIV 背景顏色的設計範例。

CSS DIV 背景顏色設計範例

<div style="background-color:#FFD382;padding:10px;margin-bottom:5px;">將 DIV 背景顏色設計為 #FFD382</div>
<div style="background-color:#82FF82;padding:10px;margin-bottom:5px;">將 DIV 背景顏色設計為 #82FF82</div>
<div style="background-color:#30FFFF;padding:10px;5">將 DIV 背景顏色設計為 #30FFFF</div>

範例呈現的效果

將 DIV 背景顏色設計為 #FFD382

將 DIV 背景顏色設計為 #82FF82

將 DIV 背景顏色設計為 #30FFFF

範例共有三個 DIV 區塊，其中有三個 CSS 屬性，分別為 background-color、padding、以及 margin-bottom，重點在於 background-color 這個用來控制 DIV 背景顏色的屬性，而 padding 僅用來控制內距，margin-bottom 是 DIV 彼此間的距離，也就是所謂的外距，對這幾個基本 CSS 屬性有興趣的朋友，可以閱讀以下幾篇語法解說。

我們回到 DIV 背景顏色的地方，各位可以注意到，每個 DIV 的 background-color 所用的色碼都不一樣，例如 #FFD382、#82FF82... 這些都是十六進位的色碼，每一種色碼僅代表一種顏色，這些色碼就是控制 DIV 背景顏色的主要關鍵，可以從本站的《色碼表》挑選不同顏色。

如果想要進一步的了解 background-color 屬性，請詳閱《CSS background-color 背景顏色》篇幅的介紹。另外，單純的背景顏色不夠滿足網頁精緻風格，可以考慮使用背景圖片，請參閱：CSS DIV 背景圖片。

延伸閱讀