Home > Web Front-end > CSS Tutorial > How to adjust transparency in css3

How to adjust transparency in css3

王林
Release: 2021-02-24 17:10:42
Original
3158 people have browsed it

How to adjust transparency in css3: You can use the opacity attribute to set transparency, such as [opacity:0.5; filter:Alpha(opacity=50);], which means setting the element transparency to 0.5.

How to adjust transparency in css3

The operating environment of this article: windows10 system, css 3, thinkpad t480 computer.

Attribute introduction:

The opacity attribute sets the opacity level of the element.

Syntax:

opacity: value|inherit;
Copy after login

Attribute value:

  • value Specifies opacity. From 0.0 (fully transparent) to 1.0 (fully opaque).

  • inherit The value of the opacity attribute should be inherited from the parent element.

Method to adjust transparency:

<!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>
Copy after login

Run result:

How to adjust transparency in css3

Related recommendations : CSS tutorial

The above is the detailed content of How to adjust transparency in css3. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template