網(wǎng)頁設(shè)計師的十六進制RGB顏色

  • 2018-08-25 21:12:10
  • 閱讀次數(shù):
  • 作者:盈嵐科技小編
  • 來源:http://51zuanshi.com.cn

CSS允許你使用HTML 網(wǎng)頁設(shè)計師很熟悉的十六進制顏色記法來定義顏色:

h1 {color:#FF0000;} /* set *Hls to red */

h2 {color:#903BC0;} /* set H2s to a dusky purple */

h3 {color:#000000;} /* set H3s to black */

h4 {color:#808080;} /* set H4s to medium gray */

到目前為止,計算機使用“十六進制記法”已經(jīng)有相當(dāng)長的時間,網(wǎng)頁開發(fā)人員往往會經(jīng)過培訓(xùn)或由實戰(zhàn)經(jīng)驗來了解如何使用十六進制。由于他們對十六進制記法相當(dāng)熟悉,所以在老式的HTML中往往會使用十六進制記法來設(shè)置顏色。這種做法也沿襲到了CSS中。以下介紹其工作原理:將三個介于00~FF的十六進制數(shù)連起來,就可以設(shè)置一種顏色。這種記法的一般語法是#RRGGBB。注意,在這三個數(shù)之間沒有空格、逗號或其他分隔符。

十六進制記法在數(shù)學(xué)上等價于上一節(jié)討論的整數(shù)三元組記法。例如,rgb(255, 255,255)就完全等價于#FFFFFF,而rgb(51,102,128>則與#336680完

全相同。你完全可以使用你想用的任何記法,無論哪一種記法,大多數(shù)用戶代理給出的表示都是相同的。如果你有一個計算器;可以在十進制和十六進制之間轉(zhuǎn)換,那么在這兩種記法間切換相當(dāng)簡單。

如果組成十六進制數(shù)的3組數(shù)各自都是成對的,CSS還允許采用一種簡寫記法。這種記法的一般語法是#RGB:

h1 {color:#000;}/* set H1s to black */

h2 (color:#666;}/* set H2s to dark gray */

h3 {color:#FFF;}/* set H3s to wh1te */

從標(biāo)記可以看到,每個顏色值中只有3位。不過,因為00~FF之間的十六進制數(shù)需要2位,而你總共只有3位,這又是怎么做到的呢?

答案是,瀏覽器會取每一位,井將其復(fù)制成兩位。因此,#F00等價于#FF0000,#6FA與#66FFAA相同,#FFF則變成#FFFFFF,這就是white。顯然,并非每種顏色都可以采用這種方式表示。例如,中灰色(medium gray)用標(biāo)準(zhǔn)十六進制記法可以寫作#808080。這就不能用簡寫記法來表示,與其最接近的記法是#888,而這等同于#888888。

顏色匯總

對于我們前面討論的所有顏色,表4-1做了一個總結(jié)。瀏覽器可能無法識別這些顏色關(guān)鍵字,因此,為了更為安全,要用RGB或十六進制三元組值來定義。另外,有些簡寫的十六進制值根本不會出現(xiàn)。在這些情況下,采用標(biāo)準(zhǔn)記法的較長值(6位)不能簡寫為3位,因為這些值不能進行復(fù)制。例如,值#880會擴展為#888800而不是#808000 (即olive)。因此,#808000沒有簡寫版本,表中相應(yīng)的項為空。

Web安全顏色

所謂“Web安全”顏色是指,在256色計算機系統(tǒng)上總能避免抖動的顏色。Web安全顏色可以表示為RGB值20%和51 (相應(yīng)的十六進制值為33)的倍數(shù)。另外,0%或0也是一個安全值。因此,如果使用RGB百分?jǐn)?shù),要讓所有這3個分量都要么是0%,要么是一個能被20整除的數(shù),例如rgb(40%,100%,80%)或rgb(60%,0%,0%)。如果使用0~255 范圍的RGB值,則各分量值要么是0要么是能被51整除的數(shù),如rgb(0,204,153)或 rgb(255,0,102。

采用十六進制記法,使用值00、33、66、99、CC和FF的三元組都認(rèn)為是Web安全的。這種例子有#669933、#00CC66、#FF00FF。這說明,Web安全顏色的簡寫十六進制值是0, 3, 6, 9, C,和F,因此,#693、#0C6和#F0F都是Web安全顏色的例子。

當(dāng)前文章標(biāo)題:網(wǎng)頁設(shè)計師的十六進制RGB顏色

當(dāng)前URL:http://51zuanshi.com.cn/news/wzzz/16-hexadecima-color.html

上一篇:網(wǎng)頁設(shè)計中的顏色數(shù)值設(shè)置

下一篇:網(wǎng)頁設(shè)計中的長度單位

網(wǎng)站建設(shè)、網(wǎng)絡(luò)營銷咨詢專線:181-8386-5875(點擊可一鍵撥號)