Home > Article > Web Front-end > How to set background translucency in css
How to set background translucency in css
- 王林Original
- 2021-03-09 14:15:2910494browse
You can use the opacity attribute to set the background translucency effect in css. This attribute is used to set the opacity level of the element, such as [opacity:0.5], which means setting the element to a semi-transparent state.
The operating environment of this article: windows10 system, css 3, thinkpad t480 computer.
If you want to set the translucency effect of an element in CSS, you can use the opacity attribute. The opacity attribute is used to set the opacity level of the element, such as [opacity:0.5].
Syntax:
opacity: value|inherit;
Attribute value:
value Specifies opacity. From 0.0 (fully transparent) to 1.0 (fully opaque). Test
inherit The value of the opacity attribute should be inherited from the parent element.
Specific example code:
<!DOCTYPE html>
<html>
<head>
<style>
div
{
background-color:red;
opacity:0.5;
filter:Alpha(opacity=50); /* IE8 以及更早的浏览器 */
}
</style>
</head>
<body>
<div>本元素的不透明度是 0.5。请注意，文本和背景色都受到不透明级别的影响。</div>
</body>
</html>(Free video tutorial: css video tutorial)
The running result is as follows:
Related recommendations: CSS tutorial
The above is the detailed content of How to set background translucency in css. For more information, please follow other related articles on the PHP Chinese website!