1. opacity
-
opacity透明度
opacity:number;
其中，number为0-1之间的浮点数，用来表示元素的透明度
0完全透明，1-完全不透明
不仅对颜色有效，对图像或页面中其他的元素也有效
- 子元素拥有相同的透明度
-
-
实现效果
image.png
rgba
<style>
/*
只要是颜色，都可以使用透明度
rgba(红色, 绿色, 蓝色, 透明度)
a:代表透明度，取值0-1,0表示完全透明，1表示不透明;
*/
div div{
height:100px;
width:200px;
/*margin:10px auto;*/
border:1px solid rgba(255,100,100,0.5);
}
.box div:first-child{
background-color: rgba(255,100,100,0.5);
position:fixed;/*覆盖标准文档流*/
}
</style>
颜色透明度效果
注：适用于文本颜色透明、背景颜色透明度、边框颜色透明度等颜色
参考
- http://c.biancheng.net/css3/opacity.html
网友评论