css层半透明字体不透明

CSS中，我们可以使用 opacity 属性来设置一个元素的透明度。但是，如果我们只想让元素的背景透明，而文字仍然保持不透明，该怎么办呢？这就需要使用 CSS 层半透明。

/* 设置元素为背景半透明 */
background-color: rgba(255,255,0.5);
/* 设置元素内文字为不透明 */
color: rgba(0,1);

如上代码所示，我们可以使用 rgba 函数来设置元素的背景色和文字颜色的透明度。其中，rgba 函数中的最后一个参数代表 alpha 值，表示透明度。这里我们将元素的背景设为半透明，即 alpha 值为 0.5，而将文字设为不透明，即 alpha 值为 1。

需要注意的是，如果元素内有子元素，它们继承的是父元素的透明度。如果想让子元素的背景和文字都不透明，可以将它们单独设置。

/* 父元素 */
background-color: rgba(255,0.5);
color: rgba(0,1);

/* 子元素 */
background-color: rgba(255,1);
color: rgba(0,1);

如上代码所示，我们可以通过给子元素单独设置背景色和文字颜色来达到让子元素不透明的效果。

最后需要注意的是，在 IE8 及以下的浏览器中，不支持 rgba 函数，需要使用 filter 属性来设置元素透明度：

/* IE8 及以下浏览器 */
background-color: transparent;
filter: alpha(opacity=50); /* 设置元素透明度为 50% */