CSS如何设置div半透明效果

html-css015

CSS如何设置div半透明效果,第1张

<div class="box"><div> .box{

    opacity: 0.5

}

opacity数值0-1之间,0是完全透明,1是完全不透明。你要是半透明是0.5

“长城郭靖”回答的是错的,他答的是让整个元素半透明

只让背景半透明只有一个办法,就是用rgba颜色,代码如下

background: rgba(0, 0, 0, 0.5)

解释:这是黑色半透明的代码

 前三个值表示颜色的red,green,blue值

 最后一个表示alpha值,就是透明度值,不透明为1

 (支持IE8+以及所有现代浏览器)

还是不懂的话,可以参考 百度百科 “rgba”词条 和 “CSS 颜色值”词条

html-css 中让一个DIV的背景色是透明的,但它的内容(文字图片之类的)不是透明的,这个的话,是可以通过设置2个div来实现的,第一个包裹着第二个div然后在设置相同的div宽高,在将第一个的opacity为0;代码如下:

<div id='div1'>

<div id='div2'>

<p>我是测试文字</p>

</div>

</div>

<style>

div{

widht:220px

height:300px

}

#div1{

background:#fff

opacity:0

z-index:10

}

#div2{

z-index:11

}

</style>