css中如何设置透明度

 我来答
xuebaotuxi
推荐于2017-09-14 · TA获得超过1.2万个赞
知道大有可为答主
回答量:4196
采纳率:85%
帮助的人:1042万
展开全部
怎样在CSS样式中设置背景的透明度,下面一个具体的实例。把类为box的层设为透明。
<div class="box"></div>
<style>
.box{width:300px; height:200px; margin:0 auto; boxder:1px solid #ccc; background:#000; filter:alpha(opacity:30); opacity:0.3; -moz-opacity:0.3;-khtml-opacity: 0.3}
</style>
其中background:#000; filter:alpha(opacity:30); opacity:0.3;为关键代码,当opacity值为1时,表示完全不透明,为0时表示完全透明。
其关的属性介绍如下:
opacity: 0.3;这是“最重要的”,因为它是在CSS的现行标准。这将在Firefox,Safari和Opera的大多数版本的工作。这将是你所需要的一切如果所有的浏览器都支持目前的标准。当然是他们不会错。
filter:alpha(opacity=30);这一个是针对IE浏览器
-moz-opacity:0.3;你需要这一个支持老版本的Mozilla浏览器如Netscape Navigator。
-khtml-opacity: 0.3;这是旧版本的Safari(1.×)当渲染引擎是使用仍被称为kthml,而不是目前的WebKit。
左迩娱乐
2018-03-29 · TA获得超过2.7万个赞
知道小有建树答主
回答量:147
采纳率:96%
帮助的人:2.2万
展开全部

怎样在CSS样式中设置背景的透明度,下面一个具体的实例。把类为box的层设为透明。

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

<style>

.box{width:300px; height:200px; margin:0 auto; boxder:1px solid #ccc; background:#000; filter:alpha(opacity:30); opacity:0.3;  -moz-opacity:0.3;-khtml-opacity: 0.3}

</style>

其中background:#000; filter:alpha(opacity:30); opacity:0.3;为关键代码,当opacity值为1时,表示完全不透明,为0时表示完全透明。

其关的属性介绍如下:

opacity: 0.3;这是“最重要的”,因为它是在CSS的现行标准。这将在Firefox,Safari和Opera的大多数版本的工作。这将是你所需要的一切如果所有的浏览器都支持目前的标准。当然是他们不会错。

filter:alpha(opacity=30);这一个是针对IE浏览器

-moz-opacity:0.3;你需要这一个支持老版本的Mozilla浏览器如Netscape Navigator。

-khtml-opacity: 0.3;这是旧版本的Safari(1.×)当渲染引擎是使用仍被称为kthml,而不是目前的WebKit。

本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
鳑鲏鱼
2012-11-06 · TA获得超过3326个赞
知道小有建树答主
回答量:684
采纳率:100%
帮助的人:644万
展开全部
50和0.5是透明度,按自己需要修改吧。
css代码:
.box{ width:100px; height:100px; background-color:#000; filter:alpha(Opacity=50); opacity: 0.5; }
html代码:
<div class="box">透明区域</div>
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
娱乐螺蛳粉
2012-11-06 · TA获得超过718个赞
知道小有建树答主
回答量:501
采纳率:0%
帮助的人:417万
展开全部
opacity: 0.4; //IE9+和非IE透明
background:rgba(0, 0, 0, 0.4); //背景透明
filter:Alpha(opacity=40);IE6,7,8
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
水煮鱼同盟free
2018-05-21
知道答主
回答量:2
采纳率:0%
帮助的人:1622
展开全部
background: rgba(255, 255, 255, 0.85) 0.85是透明度的百分比
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
收起 更多回答(3)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式