首页 > web前端 > css教程 > css设置背景层透明的方法

css设置背景层透明的方法

小云云
发布: 2017-11-27 09:47:53
原创
2751 人浏览过

css能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力。html中如果需要设置某一层的背景为透明该如何去设置呢?下面分享一下如何使用css设置透明层效果,这种方法并且是对所有浏览器都兼容的。

下面是具体的代码(以上效果设置的是0.8):

 .transparent{    
filter:alpha(opacity=50);    
-moz-opacity:0.5;    
-khtml-opacity: 0.5;    
 opacity: 0.5;    
 }
登录后复制

我们来看一下效果:

201308280902091712.jpg

下面是对以上CSS代码的一些补充说明:

opacity:0.5;这个属性是目前在CSS里面设置透明度的标准属性。适用于大多数版本的Firefox,Safari和Opera等浏览器。

filter:alpha(opacity=50);这个属性仅仅支持IE浏览器。

-moz-opacity:0.5;这个属性是为了向前兼容以前的一些老的Mozilla浏览器,比如:Netscape Navigator。

-khtml-opacity: 0.5;这个属性是为了兼容旧版本的Safari浏览器(1.x的),它使用的渲染引擎仍然称为为KTHML,相对于当前的WebKit。

以上内容就是css设置透明层效果的方法,希望对大家有帮助。

相关推荐:

css怎么设置透明度

利用CSS3新增内容实现制作透明三角形的方法实例展示

ccs透明属性和背景透明继承方法实例详解

CSS如何设置div背景透明样式的实例分析

背景颜色设置成透明实例教程

以上是css设置背景层透明的方法的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板