HTML 中是否有透明的颜色代码？

Is there a color code for transparent in HTML?

提问by Emiel.s

I'm building a new website, and I'm looking for a transparent navigation bar so the background is visible.

我正在建立一个新网站，我正在寻找一个透明的导航栏，以便背景可见。

回答by Tim B James

There is not a Transparent color code, but there is an Opacity styling. Check out the documentation about it over at developer.mozilla.org

没有透明颜色代码，但有不透明样式。在developer.mozilla.org查看有关它的文档

You will probably want to set the color of the element and then apply the opacity to it.

您可能希望设置元素的颜色，然后对其应用不透明度。

.transparent-style{

    background-color: #ffffff;
    opacity: .4;

}

You can use some online transparancy generatory which will also give you browser specific stylings. e.g. take a look at http://www.css-opacity.pascal-seven.de/

您可以使用一些在线透明度生成器，这也将为您提供浏览器特定的样式。例如看看http://www.css-opacity.pascal-seven.de/

Note thoughthat when you set the transparency of an element, any child element becomes transparent also. So you really need to overlay any other elements.

请注意，当您设置元素的透明度时，任何子元素也会变得透明。所以你真的需要覆盖任何其他元素。

You may also want to try using an RGBA colour using the Alpha (A) setting to change the opacity. e.g.

您可能还想尝试通过 Alpha (A) 设置使用 RGBA 颜色来更改不透明度。例如

.transparent-style{
    background-color: rgba(255, 255, 255, .4);
}

Using RGBA over opacitymeans that your child elements are not transparent.

使用 RGBA overopacity意味着您的子元素不透明。

回答by malvyntv

When you have a 6 digit color code e.g. #ffffff, replace it with #ffffff00. Just add 2 zeros at the end to make the color transparent.

如果您有 6 位颜色代码，例如 #ffffff，请将其替换为 #ffffff00。只需在末尾添加 2 个零即可使颜色透明。

Here is an article describing the new standard in more depth: https://css-tricks.com/8-digit-hex-codes/

这是一篇更深入地描述新标准的文章：https: //css-tricks.com/8-digit-hex-codes/

回答by Bineesh

You can specify value to background-color using rgba(), as:

您可以使用 rgba() 为 background-color 指定值，如下所示：

.style{
        background-color: rgba(100, 100, 100, 0.5);
}

0.5 is the transparency value

0.5 是透明度值

0.5 is more like semi-transparent, changing the value from 0.5 to 0 gave me true transparency.

0.5 更像是半透明，将值从 0.5 更改为 0 给了我真正的透明度。

回答by Randal

#0000ffff- that is the code that you need for transparent. I just did it and it worked.

#0000ffff- 这是透明所需的代码。我刚刚做到了，它奏效了。

回答by Manish

{background-color: transparent;}

{背景颜色：透明；}

回答by Shenal Madhushan Silva

Yeah I think the best way to transparent the background colour (make opacity only for the background) is using

是的，我认为透明背景颜色的最佳方法（仅对背景设置不透明度）是使用

.style{
        background-color: rgba(100, 100, 100, 0.5);
}

Above statement 0.5 is the opacity value.

上面的语句 0.5 是不透明度值。

It only apply the opacity changes to the background colour (not all elements')

它仅将不透明度更改应用于背景颜色（并非所有元素）

The "opacity" attribute in the CSS will transparent all the elements in the block.

CSS 中的“opacity”属性将使块中的所有元素透明。

回答by Shubham Kushwah

All you need is this:

你只需要这个：

#ffffff00

Here the ffffffis the color and 00is the transparency

这里ffffff是颜色，00是透明度

Also, if you want 50% transparent color, then sure you can do... #ffffff80

另外，如果你想要 50% 的透明颜色，那么你肯定可以做到...... #ffffff80

Where 80is the hexadecimal equivalent of 50%. Since the scale is 0-255 in RGB Colors, the half would be 255/2 = 128, which when converted to hex becomes 80

80的十六进制等价物在哪里50%。由于 RGB 颜色的比例是 0-255，所以一半将是255/2 = 128，当转换为十六进制时变为80

And since in transparent we want 0 opacity, we write 00

因为在透明我们想要 0 不透明度，我们写 00

回答by Gopal Meena

If you are looking for android apps, you can use

如果您正在寻找 android 应用程序，您可以使用

#00000000 

回答by Barun

Here, instead of making navigation bar transparent, remove any color attributes from the navigation bar to make the background visible.

在这里，不是使导航栏透明，而是从导航栏中删除任何颜色属性以使背景可见。

Strangely, I came across this thinking that I needed a transparent color, but all I needed is to remove the color attributes.

奇怪的是，我遇到了这种想法，我需要一个透明的颜色，但我需要的只是删除颜色属性。

.some-class{
    background-color: #fafafa; 
}

to

到

.some-class{
}