將RGBA顏色轉換爲HTML顏色代碼

我的應用程序中有一個顏色選擇器，用戶可以使用顏色選取應用程序輸出的某些對象的顏色。顏色選擇器正在輸出以RGBA格式選擇的顏色。但是，我需要HTML顏色代碼。我需要能夠在不知道顏色的情況下將RGBA轉換爲HTML，並稍後將其用作字符串。我會如何去做這件事？將RGBA顏色轉換爲HTML顏色代碼

來源

2012-07-07 Nathan

HTML不支持半透明顏色值 - 除非alpha被最大化，或者您不關心alpha，否則將無法獲得與RGBA顏色等效的HTML顏色代碼。您是否提到CSS顏色值，如標籤和您接受的答案所示？ – BoltClock 2012-07-15 18:10:10

@BoltClock'canvas'上下文有一個'globalAlpha'屬性，您可以使用它來設置畫布對象的透明度。 – 2012-07-15 18:41:21

RGBA是原生支持CSS3：

div { 
    background: rgba(200, 54, 54, 0.5); 
}

火狐，Safari，Chrome瀏覽器，IE9和Opera瀏覽器都支持RGBA。較老的IE不支持它。

幸運的是，您可以爲支持瀏覽器的瀏覽器指定RGBA顏色，併爲瀏覽器指定不支持的顏色。檢查這link一個偉大的howto。

這是兩個選項： - 從鏈接 -

1. BACK純色掉落：允許瀏覽器回落到混濁時不可使用純色。該

h1 { 
    color: rgb(127, 127, 127); 
    color: rgba(0, 0, 0, 0.5); //for modern browsers only 
}

2.回落到PNG：在你使用的背景顏色的透明度，其中的情況下（儘管沒有邊界或文字）有可能回落到使用帶alpha的PNG渠道獲得相同的效果。這比使用CSS更不靈活，因爲您需要爲每個透明度級別創建一個新的PNG，但它可能是一個有用的解決方案。

h1 { 
    background: transparent url(imageName.png); 
    background: rgba(0, 0, 0, 0.5) none; //for modern browsers only 
}

我想說的是，你不需要HTML顏色代碼，你只需要CSS屬性rgba添加 - JavaScript或jQuery的 - 你拿起顏色後，我想你是完成。

希望它有幫助。

來源

2012-07-07 23:54:17

我會假設對此的答案是肯定的，但是內聯樣式支持rgba正確嗎？ – Nathan 2012-07-08 00:22:03

@Natha，你說得對，答案是肯定的。這只是一種指定顏色的不同方式。 ** 1。** HEX值 - 像'「＃ff0000」' ** 2。** RGBA值 - 像'「rgb（255,0,0,0.5）」' ** 3。**一個顏色名稱 - 像''紅色'' – 2012-07-08 00:25:38

Internet Explorer支持從版本9開始的RGBA。 – BoltClock 2012-07-15 18:05:05

如果你（這你的問題的文字字面上詢問）尋找一個實際轉換從RGB（一）在JavaScript詛咒：

red = green = blue = 255; 
hex = '#' + 
    ("0" + (red).toString(16)).slice(-2) + 
    ("0" + (green).toString(16)).slice(-2) + 
    ("0" + (blue).toString(16)).slice(-2);

當然還有沒有Alpha等效的，但您可以設置不透明度（和/或瀏覽器特定的-opacity值以適應較舊的瀏覽器支持）。

來源

2012-07-15 21:50:07

將RGBA顏色轉換爲HTML顏色代碼

回答

相關問題