複製鏈接
請複製以下鏈接發送給好友

網頁顏色

鎖定
網頁顏色是在萬維網上設計網頁時,表示各種顏色的方法。顏色可以用三組十六進制數字表示,部分常用顏色或和上下文相關的內容也可以用英語名稱的“關鍵字”來表示。此外還有直接使用多組十進制表示的方法。 [1] 
中文名
網頁顏色
外文名
web color
定    義
表示各種顏色的方法
表    示
三組十六進制數字表示
學    科
物理學
領    域
物理學

網頁顏色十六進制數字表示方法

HTMLCSS中使用3字節共6個十六進制數字表示一種顏色,每字節從00到FF,相當十進位數字從0到255,按順序前兩位是紅色的值,中間兩位是綠色的值,最後兩位是藍色的值。
由於網頁是基於計算機瀏覽器開發的媒體,所以顏色以光學顏色RGB(紅、綠、藍)為主。 網頁顏色是以16進制代碼表示,一般以“#”號開頭,後面分別為R、G、B的16位進制數。 FF為最大數,代表十進制255。比如白色是R、G、B三個顏色最大,在網頁代碼便是:#FFFFFF。黑色是三個顏色為0,在網頁代碼便是:#000000。當顏色代碼為#XXYYZZ時,可以用#XYZ表示,如#135與#113355表示同樣的顏色。在CSS中,也可以使用rgb(127,127,127)代替#7F7F7F(十進制表示)。
例如一種顏色在十進位中紅、綠、藍的比例分別是36、104、160(■),在十六進位制中則分別為24、68、A0,所以十六進位制數字表示方法就為:2468A0,如果數字小於16,在十六進位中就會小於10,前面就要加0,如在十進位中分別為0、1、2,在十六進位制數字表示方法中就為:000102,所以可以表示的顏色數總共有:256= 16,777,216 種。
CSS顏色模塊第四版引入了#RRGGBBAA和#RGBA的表示方式。

網頁顏色十進制“函數”表示

從CSS2.1開始,提供有rgb(red,green,blue)的十進制顏色代碼。
從CSS3開始,網頁顏色支持RGBA和HSLA顏色表示法:
  • rgba(255,0,0,0.5)- 半透明的紅色。
  • hsla(120,100%,50%,0.3)- 半透明 (0.3) 的綠色。
這樣的語法提供了使用透明色的可能性。

網頁顏色顏色名稱

HTML4.01版本中,確定了16種顏色的英語名稱與16進制代碼:
中文
英文
代碼&顏色
中文
英文
代碼&顏色
中文
英文
代碼&顏色
中文
英文
代碼&顏色
black
#000000
silver
#c0c0c0
maroon
#800000
red
#ff0000
navy
#000080
blue
#0000ff
purple
#800080
fuchsia
#ff00ff
green
#008000
萊姆色
lime
#00ff00
olive
#808000
yellow
#ffff00
teal
#008080
cyan
#00ffff
gray
#808080
white
#ffffff
後來加入的名稱如下所列:
CSS 顏色模塊版本
中文
英文
代碼&顏色
註釋
2.1
orange
#ffa500

3
transparent
#00000000
此處的RGBA十六進制值只適用於CSS顏色模塊版本4。
4
麗貝卡紫
rebeccapurple
#663399
用來悼念埃裏克·邁耶的女兒。
除此之外,CSS3(CSS顏色模塊版本3)接納了絕大部分X11顏色(或稱SVG顏色)。

網頁顏色網頁安全顏色

當開發網頁安全顏色(Web-safe colors)調色板時,大部分顯示方式是8比特的,只能顯示256種顏色。要顯示某種硬件預先定義的顏色以外的顏色,要麼使用最接近的顏色替代,要麼多用一些時間,通過抖動混合顏色顯示。
David Lehn和Hadley Stern發現在更換16位顯示後,只有22種顏色是“真正安全”(really safe)的,可以不會在更換顯示後出現不協調的畸變。

網頁顏色漸變色

CSS3引入了漸變色,分為線性漸變(如linear-gradient(#D1EEFC, #81F3FD);)和圓心漸變(如radial-gradient(#FEFD58, #71FCA6, #52EDC7);)兩種。線性漸變支持方向設定,圓心漸變支持形狀設定。
參考資料
  • 1.    郭娜. 淺談網站色彩配色方法[J]. 職業, 2011 (35): 131-132.