CSS之 background-color: rgba(255,0,0,opacity number)
一:
backgrounde-color:rgba( ) 设置背景色的时候,可以调节背景色的透明度,注意是背景哦,所以不会存在遮罩问题。见图
#test .cover{
height: 100px;
/* background-color: red; */
/* opacity: 0.8; */
margin-top: -100px;
background-color: rgba(255,0,0,0.8) 还有因为background-color:rgba() 中的透明度是控制背景色的透明度,而opacity是控制当前元素的透明度。
}
而下面这种情形会存在遮罩问题哦!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
#test .cover{
height: 100px;
background-color: red;
opacity: 0.8;
margin-top: -100px;
/* background-color: rgba(255,0,0,0.8) */
}
二: background-color 与 background-imge无无法共存 图片的层级更高