3-19. color屬性

color 屬性規(guī)定文本的顏色峻汉。

描述
color_name 規(guī)定顏色值為顏色名稱的顏色(比如 red)销凑。
hex_number 規(guī)定顏色值為十六進(jìn)制值的顏色(比如 #ff0000)昧谊。
rgb_number 規(guī)定顏色值為 rgb 代碼的顏色(比如 rgb(255,0,0))。
inherit 規(guī)定應(yīng)該從父元素繼承顏色。
單位 描述
(顏色名) 顏色名稱 (比如 red)
rgb(x,x,x) RGB 值 (比如 rgb(255,0,0))
rgb(x%, x%, x%) RGB 百分比值 (比如 rgb(100%,0%,0%))
#rrggbb 十六進(jìn)制數(shù) (比如 #ff0000)

body
  {
  color:red;
  }
h1
  {
  color:#00ff00;
  }
p
  {
  color:rgb(0,0,255);
  }

從 0 到 255 種紅綠藍(lán)值能夠組合出總共超過一千六百萬種不同的顏色(根據(jù) 256 x 256 x 256 計(jì)算)。
大多數(shù)現(xiàn)代的顯示器都能顯示出至少 16384 種不同的顏色截型。

可以用以下方法來規(guī)定 CSS 中的顏色:

  • 十六進(jìn)制色
  • RGB 顏色
  • RGBA 顏色
  • HSL 顏色
  • HSLA 顏色
  • 預(yù)定義/跨瀏覽器顏色名

1、十六進(jìn)制顏色
所有瀏覽器都支持十六進(jìn)制顏色值儒溉。
十六進(jìn)制顏色是這樣規(guī)定的:

RRGGBB宦焦,其中的 RR(紅色)、GG(綠色)顿涣、BB(藍(lán)色)十六進(jìn)制整數(shù)規(guī)定了顏色的成分波闹。

所有值必須介于 0 與 FF 之間。
舉例說涛碑,#0000ff 值顯示為藍(lán)色精堕,這是因?yàn)樗{(lán)色成分被設(shè)置為最高值(ff),而其他成分被設(shè)置為 0锌唾。
在CSS中只要十六進(jìn)制的顏色每?jī)晌坏闹刀际且粯拥? 那么就可以簡(jiǎn)寫為一位
例如: #FFEE00 == #FE0

p
{
background-color:#0000ff;
}

2、RGB 顏色
所有瀏覽器都支持 RGB 顏色值夺英。
RGB 顏色值是這樣規(guī)定的:rgb(red, green, blue)晌涕。
每個(gè)參數(shù) (red、green 痛悯、 blue) 定義顏色的強(qiáng)度余黎,可以是介于 0 與 255 之間的整數(shù),或者是百分比值(從 0% 到 100%)载萌。
舉例說惧财,rgb(0,0,255) 值顯示為藍(lán)色,這是因?yàn)?blue 參數(shù)被設(shè)置為最高值(255)扭仁,而其他被設(shè)置為 0垮衷。
同樣地,這兩個(gè)值定義了相同的顏色:rgb(0,0,255) 和 rgb(0%,0%,100%)乖坠。

p
{
background-color:rgb(255,0,0);
}

3搀突、RGBA 顏色
RGBA 顏色值是 RGB 顏色值的擴(kuò)展,帶有一個(gè) alpha 通道 - 它規(guī)定了對(duì)象的不透明度熊泵。
RGBA 顏色值是這樣規(guī)定的:rgba(red, green, blue, alpha)仰迁。
alpha 參數(shù)是介于 0.0(完全透明)與 1.0(完全不透明)的數(shù)字,取值越小就越透明顽分。

p
{
background-color:rgba(255,0,0,0.5);
}

4徐许、HSL 顏色
HSL 指的是 hue(色調(diào))、saturation(飽和度)卒蘸、lightness(亮度) - 表示顏色柱面坐標(biāo)表示法雌隅。
HSL 顏色值是這樣規(guī)定的:hsl(hue, saturation, lightness)。
Hue 是色盤上的度數(shù)(從 0 到 360) - 0 (或 360) 是紅色,120 是綠色澄步,240 是藍(lán)色冰蘑。
Saturation 是百分比值;0% 意味著灰色村缸,而 100% 是全彩祠肥。
Lightness 同樣是百分比值;0% 是黑色梯皿,100% 是白色仇箱。

p
{
background-color:hsl(120,65%,75%);
}

5、HSLA 顏色
HSLA 顏色值是 HSL 顏色值的擴(kuò)展东羹,帶有一個(gè) alpha 通道 - 它規(guī)定了對(duì)象的不透明度剂桥。
HSLA 顏色值是這樣規(guī)定的:hsla(hue, saturation, lightness, alpha),其中的 alpha 參數(shù)定義不透明度属提。alpha 參數(shù)是介于 0.0(完全透明)與 1.0(完全不透明)的數(shù)字权逗。

p
{
background-color:hsla(120,65%,75%,0.3);
}

6、顏色名字
HTML 和 CSS 顏色規(guī)范中定義了 147 中顏色名(17 種標(biāo)準(zhǔn)顏色加 130 種其他顏色)冤议。

p{
  color:red;
  }

最常用還是前面2種斟薇,所有的瀏覽器都支持。
http://www.w3school.com.cn/cssref/pr_text_color.asp
http://www.w3school.com.cn/cssref/css_colornames.asp
http://www.w3school.com.cn/cssref/css_colorsfull.asp

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末恕酸,一起剝皮案震驚了整個(gè)濱河市堪滨,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌蕊温,老刑警劉巖袱箱,帶你破解...
    沈念sama閱讀 217,657評(píng)論 6 505
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異义矛,居然都是意外死亡发笔,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,889評(píng)論 3 394
  • 文/潘曉璐 我一進(jìn)店門凉翻,熙熙樓的掌柜王于貴愁眉苦臉地迎上來筐咧,“玉大人,你說我怎么就攤上這事噪矛×咳铮” “怎么了?”我有些...
    開封第一講書人閱讀 164,057評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵艇挨,是天一觀的道長(zhǎng)残炮。 經(jīng)常有香客問我,道長(zhǎng)缩滨,這世上最難降的妖魔是什么势就? 我笑而不...
    開封第一講書人閱讀 58,509評(píng)論 1 293
  • 正文 為了忘掉前任泉瞻,我火速辦了婚禮,結(jié)果婚禮上苞冯,老公的妹妹穿的比我還像新娘袖牙。我一直安慰自己,他們只是感情好舅锄,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,562評(píng)論 6 392
  • 文/花漫 我一把揭開白布鞭达。 她就那樣靜靜地躺著,像睡著了一般皇忿。 火紅的嫁衣襯著肌膚如雪畴蹭。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,443評(píng)論 1 302
  • 那天鳍烁,我揣著相機(jī)與錄音叨襟,去河邊找鬼。 笑死幔荒,一個(gè)胖子當(dāng)著我的面吹牛糊闽,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播爹梁,決...
    沈念sama閱讀 40,251評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼右犹,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了卫键?” 一聲冷哼從身側(cè)響起傀履,我...
    開封第一講書人閱讀 39,129評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤虱朵,失蹤者是張志新(化名)和其女友劉穎莉炉,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體碴犬,經(jīng)...
    沈念sama閱讀 45,561評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡絮宁,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,779評(píng)論 3 335
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了服协。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片绍昂。...
    茶點(diǎn)故事閱讀 39,902評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖偿荷,靈堂內(nèi)的尸體忽然破棺而出窘游,到底是詐尸還是另有隱情,我是刑警寧澤跳纳,帶...
    沈念sama閱讀 35,621評(píng)論 5 345
  • 正文 年R本政府宣布忍饰,位于F島的核電站,受9級(jí)特大地震影響寺庄,放射性物質(zhì)發(fā)生泄漏艾蓝。R本人自食惡果不足惜力崇,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,220評(píng)論 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望赢织。 院中可真熱鬧亮靴,春花似錦、人聲如沸于置。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,838評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽俱两。三九已至饱狂,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間宪彩,已是汗流浹背休讳。 一陣腳步聲響...
    開封第一講書人閱讀 32,971評(píng)論 1 269
  • 我被黑心中介騙來泰國(guó)打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留尿孔,地道東北人俊柔。 一個(gè)月前我還...
    沈念sama閱讀 48,025評(píng)論 2 370
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像活合,于是被迫代替她去往敵國(guó)和親雏婶。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,843評(píng)論 2 354

推薦閱讀更多精彩內(nèi)容

  • -------------------------一白指、控制指令--------------------------...
    夜幕小草閱讀 3,149評(píng)論 0 5
  • 什么是顏色 Wiki是這樣說的:顏色或色彩是通過眼留晚、腦和我們的生活經(jīng)驗(yàn)所產(chǎn)生的一種對(duì)光的視覺效應(yīng)。嗯告嘲,簡(jiǎn)單點(diǎn)說错维,顏...
    評(píng)評(píng)分分閱讀 32,609評(píng)論 6 57
  • 1.顏色有幾種寫法 這里暫且不提透明色,把它放在下一部分橄唬。 (1).關(guān)鍵字寫法: 直接指定顏色名赋焕,如red、blu...
    zh_yang閱讀 646評(píng)論 0 0
  • 1.網(wǎng)頁亂碼的問題是如何產(chǎn)生的仰楚?怎么解決隆判? 一:亂碼產(chǎn)生的原因是:當(dāng)我們保存文件時(shí)會(huì)把我們寫入的文字使用編輯器默認(rèn)...
    freddy閱讀 572評(píng)論 0 0
  • 一、相關(guān)網(wǎng)站地址 Sass官網(wǎng):http://sass-lang.com/僧界;Sass中文網(wǎng):https://www...
    夏晶晶綠閱讀 847評(píng)論 0 0