2009-09-14 68 views
76

如何以十六進制格式表示顏色(包括alpha通道)是否有W3或任何其他值得注意的標準?帶alpha通道顏色的十六進制表示?

是#RGBA還是#ARGB?

+5

它的到來在CSS顏色4級[來源](HTTP:// lists.w3.org/Archives/Public/www-style/2013Apr/0051.html)(見第四個要點) –

+0

@ŠimeVidas如果你已經在答案中提出了這個問題,我會提高你的評價。 –

+0

@cirosantilli我看起來像我需要代表? ':-P' –

回答

43

在CSS 3中,爲了引用規範,「RGBA值沒有十六進制表示法」(請參閱​​CSS Level 3 spec)。相反,您可以使用帶小數或百分數的rgba()函數表示法,例如rgba(255,0,0,0.5)將是50%透明紅色。 RGB通道是0-255或0%-100%,alpha是0-1。

在CSS 4 *,可以指定使用第七和一個8位十六進制顏色的第八字符,或一個4位十六進制顏色的第四字符阿爾法通道(見CSS Level 4 spec *)

瀏覽器支持作爲2017年11月

  • 自從Firefox 49(Mozilla bug 567283)以來,Firefox已經支持這種語法。
  • Safari自Safari 10以來支持此語法。
  • 自Chrome 62以來,Chrome在桌面上支持此語法。對於早期版本,您可以啓用實驗性網頁功能以使用此語法。請參閱Chromium Issue 618472Webkit bug 150853
  • Android上的Chrome預計支持Android P中的語法。
  • Opera將可能在Opera 49中支持此語法。
  • IE 11和EdgeHTML 15(Edge 40)不支持此語法。

到目前爲止瀏覽器支持信息available on CanIUse.com

*技術上仍處於草案,但由於瀏覽器的支持,這是不可能改變的。

+2

截至目前,Mozilla(Firefox 49)似乎支持#RRGGBBAA和#RGBA – Shiyaz

+0

有關當前瀏覽器支持信息,請參閱https://caniuse.com/#feat=css-rrggbbaa – Stony

14

我不知道,如果有一個正式的標準 -

RGBA是我見過的Web Macromedia公司的代表和其他人使用ARGB

我相信,RGBA是比較常見的表現。

如果有幫助,這是從W3對CSS3
http://www.w3.org/TR/css3-color/#rgba-color

編輯(帕特里克):報價從上面的W3鏈接

與RGB值,沒有十六進制表示爲RGBA值

+2

此外,用於指定帶alpha的顏色的CSS函數是從您發佈的W3鏈接獲得的rgba() – Amber

+7

:與RGB值不同,RGBA值不存在十六進制符號。 –

+2

我見過#RGB,A之前。奇怪的。 – Joshua

67

看起來像沒有十六進制alpha格式:http://www.w3.org/TR/css3-color/

無論如何,如果你使用一個CSS預處理器像SASS那麼你可以傳遞一個十六進制rgba: 背景:

rgba(#000, 0.5); 

器和預處理器只是轉換的十六進制代碼自動RGB。

+3

非常酷。感謝提及! – AndrewHenderson

1

您可以嘗試將十六進制顏色放入GIMP或照片商店的顏色選擇器以獲取RGB值,然後使用alpha值。例如。紅色是#FF0000rgb(255,0,0)如果你想紅色的alpha值爲.5,然後rgba(255,0,0,.5)

也許不完全是你想要的,但希望有所幫助。

+0

這是投票下來,這似乎有點苛刻。它沒有回答所問的問題,但問題並沒有說明他們爲什麼想知道。如果他們只是想在CSS中使用RGBA顏色,那麼這個答案是正確的。 – thelem

1

鉻52+ supports阿爾法(十六進制)

background: #56ff0077; 

對於舊的瀏覽器,你將不得不使用:

background-color: rgba(255, 220, 0, 0.3); 
+2

不,它不會,除非您啓用實驗性網頁功能,因爲它在Android上造成問題。有關瀏覽器支持的詳細信息,請參閱上面的答案 – thelem