css中文字的透明度

在CSS中，我们可以使用opacity 属性来设置一个元素的整体透明度。但是，如果我们只想控制元素中的文本透明度，该怎么办呢？答案是使用 color 属性的RGBA表示法。

p {
  color: rgba(255, 255, 255, 0.5);
} 

以上代码中，rgba(255, 255, 255, 0.5) 表示的是颜色白色的RGBA表示法，其中最后一位0.5表示透明度。这里取值从0（完全透明）到1（完全不透明）。

使用RGBA表示法来控制文本的透明度，有以下几个优点:

• 只控制文本透明度，不影响背景色透明度
• 兼容性好，IE9以上和其他主流浏览器都支持
• 可以与opacity 属性一起使用，实现更细粒度地控制元素透明度

需要注意的是，当使用RGBA表示法设置文本透明度时，对应元素的背景色也需要是透明的。否则，设置的透明度效果会被背景色所覆盖。

p {
  background-color: rgba(0, 0, 0, 0.5);
  color: rgba(255, 255, 255, 0.5);
} 

在以上代码中，background-color: rgba(0, 0, 0, 0.5) 设置了元素的背景色为黑色，并且透明度为0.5，与文本的透明度相同。

综上所述，通过使用color 属性的RGBA表示法，可以实现对元素文本透明度的控制。这是Web开发中一个简单而有用的技巧，非常值得掌握。