HTML font color 網頁文字顏色設計

HTML font color 網頁文字顏色設計是非常傳統的設計技巧,嚴格來說 color 只是 HTML font 標籤中的一項功能,類似 size 用來控制文字大小、face 用來控制文字字型,而 color 則用來控置文字的顏色,常見的瀏覽器幾乎都支援 font color 屬性。使用 HTML font color 的優點是可以很輕鬆的修改網頁中任意文字的顏色,來達到美化網頁的效果,缺點是大型網頁的文字管理效率較差,通常會用 CSScolor 語法取代,這點後面會再提到,先來看看基本的 HTML font color 語法以及範例應用。

HTML font color 的語法

HTML font tag 的 color 用法相當簡單,等號右邊用雙引號或單引號包起來的就是要顯示的顏色,font color 接受多種顏色表示法,例如十六進位色碼、RGB 色碼或顏色英文名稱,完全看設計師自己的需求即可,我們將語法直接套用到以下範例看結果。

HTML font color 的範例

功能:在新視窗開啟程式碼
範例的視覺效果
褐色系文字 褐色系文字 褐色系文字
綠色系文字 綠色系文字 綠色系文字
黑色系文字 黑色系文字 黑色系文字
範例中每一組 color 所使用的顏色都是十六進位的色碼,可以從 Wibibi 的《色碼表》找到更多的顏色,只要更換 color 等號右邊雙引號內的色碼,文字顏色就會改變。

另外附帶一提,雖然說我們的範例是從上而下,一行寫一個 font color 例子,可是並不代表顯示結果會變成一行一行的唷!因為範例的程式碼是 HTML 原始碼,換行符號是 br 的那個標籤,換句話說,有 br 標籤才會換行。

關於 HTML font color 的 CSS 替代語法

雖然說 HTML 的 font color 真的很簡單又很好用,在製作一般的小型網頁時,效率也算是還不錯,因為要修改顏色的文字只要一套用,馬上就修改完成,可是當街觸到較大型的專案,就會發現在管理整體網頁文字顏色的時候,HTML 的 font color 效率並不是很高,因為每個文字都要寫一次,這也是 HTML 本身較傳統的設計,如果想要改善這樣的問題,改用 CSScolor 屬性,透過 CSS 的大量管理優點,才能有效率的管理大型專案的文字顏色,其實用久了會發現,就算只是一般網頁,用 CSS 的 color 屬性還是有許多比 HTML font color 優的地方,如果你對 CSS 的 color 屬性有興趣,可以參考《CSS color 屬性設計網頁文字顏色》的內容。

更多 HTML 文字設計
分享於 2015-01-21 - 更新於 2017-07-31