css如何设置透明度(兼容ie,firefox)

html-css017

css如何设置透明度(兼容ie,firefox),第1张

css设置透明度,首先需要知道的是在浏览器中的不同使用,一般在ie中用的是filter:alpha(opacity=0)这个属性来设置div或者是块级元素的透明度,而在firefox中,一般就是直接使用opacity:0,对于兼容的,一般的做法就是在书写css样式的将2个都写上就行,就能实现兼容,具体看代码:

<html>

<head>

#div1{

width:200px

height:600px

margin:0 auto

opacity:0

filter:alpha(opacity=0)//0 代表的是隐藏,就是透明度最低。

}

</head>

<body>

<div id='div1'>

<p>测试文字。</p>

</div>

</body>

</html>

ie6下的完全透明,直接使用transparent就能全部兼容

.bg{background:transparent}

2、只有半透明才需要用到filter滤镜来处理.

.bg{

background: #000000

filter:Alpha(opacity=50)/* 只支持IE6、7、8、9 */

position:static/* IE6、7、8只能设置position:static(默认属性) ,否则会导致子元素继承Alpha值 */

*zoom:1/* 激活IE6、7的haslayout属性,让它读懂Alpha */

}

ie6是不支持opacity这个属性的,如果一定要做透明背景,建议使用GIF格式的图片,把图片做成透明的,然后设为背景。PNG格式的图也能做成透明的,但在IE6中会有点问题,也可以使用JS代码 修正,但最好还是用GIF。