前端工程師 可以使用背景顏色設定 (background-color)屬性,讓簡潔的純色背景襯托出網頁的主體、也可以決定網頁的風格。像背景純黑的網頁和背景為粉紅色的網頁,風格就截然不同。其實 background-color 能夠使用的範圍除了網頁背景色外,也可以用來設計表格、DIV 區塊、span 等網頁元素的背景顏色。
CSS background-color 基本語法如下:
background-color: 顏色名稱或色碼 ;
background-color 可以使用的顏色值包含顏色的英文名稱、十六進位制色碼以及 RGB 色碼,挑選顏色請參考:網頁顏色代碼對照表。CSS background-color 語法範例一、網頁背景
html{background-color: 顏色名稱或色碼 ;}
CSS background-color 語法範例二、DIV 區塊、H1-H6 標題等斷落的背景顏色
div(可替換成 h1、p 等網頁元素標籤){background-color: 顏色名稱或色碼 ;}
同樣的技巧 前端工程師 還可用在其他的網頁元素,若想採用圖片當成背景,請參閱:2. 背景圖樣設定 (background-image)。
其他常用 CSS background 背景屬性說明連結 1. 背景顏色設定 (background-color) 2. 背景圖樣設定 (background-image) 3. 背景重複設定 (background-repeat) 4. 背景固定模式設定 (background-attachment) 5. 背景圖片位置設定 (background-position) |
相關閱讀:
前端工程師如何將CSS樣式表套用至HTML?
前端工程師基礎CSS精選懶人包
前端工程師必學-CSS 常見邊框屬性解釋
神奇的「KISS 原則」網路行銷課程壓軸登場
網路行銷課程爆紅APP-打造屬於你的超Q人偶,一起跟好友互動!
SEO優化課程教你如何迅速設定好網頁的robots meta!!
HTML5教學讓你讀電子書更加賞心悅目!