大家好，又见面了，我是你们的朋友全栈君。
CSS3 opacity属性记录
设置一个div元素的透明度级别
实现原理：
opacity属性在实现的原理上极度类似于PS中的蒙版概念
样式：
div{
opacity:0.5;
}
取值范围: 0 ~ 1
注意:IE8和早期版本支持另一种过滤器属性。像：filter:Alpha(opacity=50)
属性说明
- 默认值：1
- 继承性：no（不继承）
- 版本：CSS3
- 属性：object.style.opacity
问题
1.如果父元素设置opacity属性，那么这个的所有子元素都会受影响（继承）并且无法位子元素（opacity：1）的方法来改变子元素的这个属性。
解决方法：
- 设置rgba属性：background-color:rgba(0,0,0,.5)。
- 父元素div（设置为相对定位），子元素div1（设置为绝对定位）背景正常加透明度即可，子元素div2（设置为绝对定位），层级关系高于div1
2.父子关系间，opacity不受index影响，但是，兄弟关系间opacity受index影响，若opacity；0.5的元素index属性最大，则会影响兄弟关系的显示(此处用了一个大佬的引用，地址在最下方)
总结：
- 虽然opacity没有继承性，子元素的opacity属性为默认值，但是会受到父元素的影响（蒙版效果影响）
- opacity兄弟之间会因为index的层级产生影响
学习链接：
- https://blog.csdn.net/baidu_39068138/article/details/109163308?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.control&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.control
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/141314.html原文链接：https://javaforall.net
