css不继承透明度

很多初学者在使用CSS时常常会遇到这样的问题：设置一个父元素的透明度，为什么子元素的透明度没有继承下来呢？

其实，这是CSS中的一个基本规则：透明度不会被继承。

父元素 {
    opacity: 0.5; /* 设置父元素透明度为0.5 */
}

子元素 {
    /* 这里设置透明度不会继承父元素的透明度 */
} 

那么，如何让子元素继承父元素的透明度呢？

有两种方法：

第一种方法是使用RGBA颜色设置子元素的透明度。直接设置opacity属性是不行的，需要在颜色值中加入alpha通道来控制透明度。

父元素 {
    opacity: 0.5; /* 设置父元素透明度为0.5 */
}

子元素 {
    background-color: rgba(255, 0, 0, 0.5); /* 设置子元素背景色为红色，透明度为0.5 */
} 

第二种方法是使用inherit关键字继承父元素的透明度。

父元素 {
    opacity: 0.5; /* 设置父元素透明度为0.5 */
}

子元素 {
    opacity: inherit; /* 设置子元素透明度为继承自父元素的透明度 */
} 

总之，想要子元素继承父元素的透明度，一定要记得使用以上两种方法。