这篇文章主要介绍了CSS中opacity属性怎么用，具有一定借鉴价值，感兴趣的朋友可以参考下，希望大家阅读完这篇文章之后大有收获，下面让小编带着大家一起了解一下。
opacity属性的使用方法
描述如下
opacity:值;
在值部分中，可以使用0.0到1.0的数值指定不透明度。数字越大，不透明度越高，显示的越清晰。相反，数字越小，不透明度越低，显示的越模糊。此外，如果为值输入inherit，则继承父元素的值。
即使将其设置在0.0到1.0的范围之外，也可以在此范围内应用（例如：-1→0/2→1）将不透明度设置为0使其完全透明，并从屏幕上消失。
当不透明度设置为1时，它变得完全不透明。（初始值）
接下来让我们来看opacity属性的具体示例
当值是小数点时
代码如下
HTML代码
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8"/>
<linkrel="stylesheet"href="sample.css"type="text/css">
</head>
<body>
<div>
<p>当值是小数的情况下</p>
</div>
</body>
</html>
CSS代码
div{background-color:#b0e0e6;}
p{opacity:0.5;}
在这里，我们在<div>区域的<p>段落中输入文本，背景颜色为#b0e0e6，并将<p>的不透明度值设置为0.5。
段落的字符部分的不透明度已经改变，它显示出略微透明。此外，由于<div>区域中未设置不透明度，因此背景颜色的不透明度未更改。
感谢你能够认真阅读完这篇文章，希望小编分享的“CSS中opacity属性怎么用”这篇文章对大家有帮助，同时也希望大家多多支持亿速云，关注亿速云行业资讯频道，更多相关知识等着你来学习!
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
