Html 将 RGBA 转换为十六进制
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21576092/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Convert RGBA to HEX
提问by Michael B?ckling
Given a css color value like:
给定一个 css 颜色值，如：
rgba(0, 0, 0, 0.86)
How do I convert that to a RGB hex value that takes the alpha component into account, assuming a white background?
假设背景为白色，如何将其转换为考虑 alpha 分量的 RGB 十六进制值？
回答by Marco A.
Since alpha value both attenuates the background color and the color value, something like this could do the trick:
由于 alpha 值同时衰减背景颜色和颜色值，这样的事情可以做到这一点：
function rgba2rgb(RGB_background, RGBA_color)
{
var alpha = RGBA_color.a;
return new Color(
(1 - alpha) * RGB_background.r + alpha * RGBA_color.r,
(1 - alpha) * RGB_background.g + alpha * RGBA_color.g,
(1 - alpha) * RGB_background.b + alpha * RGBA_color.b
);
}
(Try it interactively: http://marcodiiga.github.io/rgba-to-rgb-conversion)
回答by t0yk4t
Assuming that the values are 0...1 per channel. And assuming that the abbreviation in the method / function call in the question correspond to the arguments, the following should work.
假设每个通道的值为 0...1。假设问题中方法/函数调用中的缩写对应于参数，以下应该有效。
A = 255 * 0.86
R = 255 * 0
G = 255 * 0
B = 255 * 0
Note you may want to change how it rounds off here as it may give inaccuracies in colours.
请注意，您可能希望在此处更改它的四舍五入方式，因为它可能会导致颜色不准确。
At this point, the values are in fact still floating point values, but casting them to a byte or a char (depending on language), should in theory work.
在这一点上，这些值实际上仍然是浮点值，但将它们转换为字节或字符（取决于语言），理论上应该可行。
var _A = (byte)219.3
var _R = (byte)0
var _G = (byte)0
var _B = (byte)0
Now all you have to do is convert them to a hexadecimal string each, and concatenate them (ARGB) and put a nice little hash tag in front (#)
现在您要做的就是将它们各自转换为一个十六进制字符串，然后将它们连接起来 (ARGB) 并在前面放一个漂亮的小哈希标签 (#)
In C# you could do something akin to:
在 C# 中，您可以执行以下操作：
var hexString = string.Format("#{0:X2}{1:X2}{2:X2}{3:X2}", _A, _R, _G, _B);
Yielding a final result of something like:
产生类似的最终结果：
#DB000000
回答by Green Wizard
you can convert red,green and blue individually using .toString(16)and then combine the result in a case, if you just want to convert a rgb to hex... since you are searching to convert rgba to hex i thought it would be better to convert the rgba to rgb and then to hex as i did in the following Fiddle, which would also consider the background-colorof the parentdiv.
您可以使用单独转换红色、绿色和蓝色.toString(16)，然后将结果合并到一个案例中，如果您只想将 rgb 转换为十六进制...因为您正在搜索将 rgba 转换为十六进制，我认为最好将RGBA为rgb，然后为十六进制正如我在下面做了小提琴，这也将考虑background-color的parentdiv。
回答by ArmaGeddON
The rgba value you are having is: rgba(0, 0, 0, 0.86)
您拥有的 rgba 值是： rgba(0, 0, 0, 0.86)
First 0 stands for RED
Second 0 stands for GREEN
Third 0 stands for BLUE
and the last digit 0.86 stands for alpha/opacity
第一个 0 代表红色
第二个 0 代表绿色
第三个 0 代表蓝色
，最后一位数字 0.86 代表alpha/opacity
Here are some links for rgb to hex converter:
以下是 rgb 到十六进制转换器的一些链接：
http://www.javascripter.net/faq/rgbtohex.htm
http://www.rgbtohex.net/
http://www.yellowpipe.com/yis/tools/hex-to-rgb/color-converter.php
http://www.javascripter.net/faq/rgbtohex.htm
http://www.rgbtohex.net/
http://www.yellowpipe.com/yis/tools/hex-to-rgb/color-converter.php
with you digits 0, 0, 0. The Hex Code will be
与您的数字 0, 0, 0。十六进制代码将是
#000000
Following is the code for low opacity with a white background
以下是白色背景的低不透明度代码
HTML
HTML
<div id="parentDiv">
<div id="childDiv">
</div>
</div>
CSS
CSS
#parentDiv
{
height:100px; /* The property of Child is Inherit */
width:100px; /* The property of Child is Inherit*/
background-color:#ffffff;
}
#childDiv
{
height:inherit;
width:inherit;
background-color:#000000;
opacity:0.86;
filter:alpha(opacity="86");
}
Now the parent Div is the background with
现在父 Div 是背景
#ffffff (White color)
