css中filter:alpha透明度使用小结兼容IE、火狐

下面就是CSS中filter:alpha透明度的使用小结及兼容IE、火狐的攻略：

下面就是CSS中filter:alpha透明度的使用小结及兼容IE、火狐的攻略：

标题

CSS中filter:alpha透明度使用小结兼容IE、火狐

什么是filter:alpha透明度

CSS的filter:alpha属性用于设置元素的透明度。透明度是指元素的不透明度，单位为百分比，值域为0~100，0表示完全透明，100表示完全不透明。

兼容性

filter:alpha是CSS3属性，只有较新版本的浏览器才支持它。但是为了让旧版浏览器也可以支持透明度效果，可以使用IE浏览器专有的滤镜属性alpha。

兼容IE的写法

对于IE浏览器，可以使用下面的代码来设置元素的透明度：

filter:alpha(opacity=50);

其中，opacity的值为透明度值，单位是百分比，值域为0~100。

兼容非IE浏览器的写法

对于非IE浏览器，可以使用如下代码来设置元素透明度：

opacity:0.5;

其中，opacity的值为透明度值，单位是百分比，值域为0~1，即0表示完全透明，1表示完全不透明。

示例1

下面是一个使用filter:alpha透明度属性的示例：

<div class="box"></div>

.box {
  width: 100px;
  height: 100px;
  background-color: red;
  filter:alpha(opacity=50);
  opacity:0.5;
}

该示例中，一个红色的正方形box元素设置了透明度为50%。

示例2

下面是一个兼容IE浏览器的透明度示例：

<div class="box"></div>

.box {
  width: 100px;
  height: 100px;
  background-color: red;
  filter:alpha(opacity=50);
}

该示例中，一个红色的正方形box元素设置了透明度为50%，针对IE浏览器使用了filter:alpha属性。

以上就是filter:alpha透明度的使用小结及兼容IE、火狐的攻略，希望对你有所帮助。