在CSS中有一个Alpha滤镜,这个滤镜可以设置目标元素的透明度。还可以通过指定坐标,从而实现各种不通范围的透明度。具体语法如下:

引用内容:
{filter: alpha(opacity=opacity,finishopacity=finishopacity,style=style,startx=startx,starty=starty,finishx=finishx,finishy=finishy)}

具体参数:
opacity 透明度。默认的范围是从0 到 100,他们其实是百分比的形式。也就是说,0代表完全透明,100代表完全不透明。
finishopacity 是一个可选参数,如果想要设置渐变的透明效果,就可以使用他们来指定结束时的透明度。范围也是0 到 100。
style    指定透明区域的形状特征:0 代表统一形状,1 代表线形,2 代表放射状,3 代表矩形
startx   渐变透明效果开始处的 X坐标。
starty   渐变透明效果开始处的 Y坐标。
finishx 渐变透明效果结束处的 X坐标。
finishy 渐变透明效果结束处的 Y坐标。

测试:

filter:alpha(opacity=50);

#snake{
backgournd: #666;
filter:alpha(opacity=50); /*IE*/
-moz-opacity:0.5; /*MOZ , FF*/
opacity:0.5; /*CSS3, FF1.5*/
}

<div id=”snake” >背景透明效果</div>

/****************百度的这个例子更简单,哈哈
//透明层
<div id=”dialogBoxBG” style=”position: absolute; top: 0px; left: 0px; width: 100%; height: 2999px; z-index: 10001; opacity: 0.4; background-color: #eeeeee;”/>

//透明层上面的浮动层 如登陆表单等等。
<div id=”dialogBox” style=”border: 1px solid #709cd2; z-index: 10003; position: absolute; width: 440px; left: 410.5px; top: 128px;”>

opacity:0.4    //这种写法只适用于FF
filter:alpha(opacity=50);   //这种写法只适用于IE
所以要这两种同时写上就能兼容了

兼容多浏览器的CSS背景透明相关推荐

  1. css位置-moz-兼容,兼容不同浏览器的CSS前缀-webkit-,-ms-,-moz-,-o-

    笔者在工作实践中发现当需要CSS兼容不同的浏览器时,需要在CSS样式前加上不同的前缀,从而使其他浏览器也能够达到相同的页面效果. 那么我们怎么去加上这些前缀呢?我们一起带着疑问来进行学习: 1.前缀分 ...

  2. css怎么恢复清背景,如何清除css背景透明?

    我不知道它是如何发生的,对我而言,我无法修复它.如何清除css背景透明? 我有一个使用display:none隐藏的div; 当用户点击时,我设置显示:块显示一个新的图层. 问题是,所有的文字都从后面 ...

  3. html字不透明度,css 背景透明文字(内容)不透明三种实现方法

    好久没写博客了.以前还想着最少一个月抽空写几篇.结果没做到O(∩_∩)O~~.好吧.现在努力,继续坚持. 看着以前写的东西,感觉自己在逐渐成长. 先上图: 本文主要记录如上图一样的.文字或内容不透明, ...

  4. css背景透明(css背景透明度怎么设置)

    CSS 背景颜色透明怎么弄 外层div: background-color: rgba(255, 255, 255, 0.9); /* 白色并且阿尔法通道是0.9*/ 内层div: backgroun ...

  5. css设置背景透明 兼容,每日一更之CSS背景透明内容不透明及CSS兼容性写法

    有一个浏览器,让所有的前端极度痛恨,没错,就是IE.IE9以上版本的浏览器还好,但是,IE9及以下浏览器就相当的恶心,对于前端来说,最基本的就是还原UI设计图,但是当你使用一些CSS3属性的时候,IE ...

  6. 如何写出兼容大部分浏览器的CSS 代码

    前阵子一直在从事b/s 项目的开发,在css 方面有一些心得体会,特写来与大家分享,欢迎大家评论,不过请勿人身攻击啊,因为在前几年我也写过一篇文章:[原]兼容浏览器的布局CSS心得体会 楼下有很多人的 ...

  7. css背景透明文子不透明,CSS 实现背景透明 内容文字不透明 显示

    思路主要是 IE9+ 谷歌 火狐等使用rgba(0,0,0,0.5)来确定透明度 前三个值是RGB值 可以直接参考PS里对应的值 最后一个是透明度 例子 background:rgba(255,255 ...

  8. html 滤镜兼容,哪些浏览器支持css滤镜?

    css滤镜的标识符是"filter",总体的应用上和其他的css语句相同.css滤镜可分为基本滤镜和高级滤镜两种.可以直接作用于对象上,并且立即生效的滤镜称为基本滤镜.而要配合Ja ...

  9. CSS 背景透明文字不透明

    background:rgba(12, 7, 7, 0.45);括号里面的前3个值是rgba的颜色值,0.45是透明度,透明度的范围是0~1,0是完全透明, 1是完全不透明.

最新文章

  1. 哈哈,我的博客开通啦,欢迎光临~~~~~~~~~~~~
  2. 11--Rails数据交互3
  3. 图形基础 GPU架构(5)GPU vs CPU
  4. multiprocessing多进程(31-04)创建进程的两种方式
  5. 八.利用springAMQP实现异步消息队列的日志管理
  6. 动手动脑 - 继承与多态
  7. html用a标签怎么提交表单?
  8. 百度地图动态显示查询结构
  9. Apple’s current market value is more than two trillion
  10. VB 设置ListView中指定一行的背景颜色
  11. c语言指针交换字符串组,c语言 指针交换两个字符串
  12. Dev gridView中设置自适应列宽和日期显示格式、金额的显示格式
  13. vue仿微博评论回复_vue-微博评论
  14. 基于javacv的视频转码(升级版)
  15. springboot实现条形码_java生成条形码(多种条码类型生成)
  16. ajax 返回html不返回json,jQuery ajax调用返回HTML而不是JSON的Ajax响应
  17. All matches were filtered out by modular filtering for argument: mysql-community-server
  18. PROC PRINT过程
  19. PHP网页的工作原理
  20. LeetCode之报数(简单 模拟 递归)

热门文章

  1. AndroidStudio安卓原生开发_启动系统的activity_短信发送activity_摄像头activity_电话拨打activity---Android原生开发工作笔记94
  2. AndroidStudio_解决butterknife在module中使用BindView Attribute value must be constant---Android原生开发工作笔记229
  3. Linux使用evhttp实现一个简单的HttpServer
  4. hibernate数据库连接池
  5. 微信小程序上传接口php,微信小程序API 上传、下载
  6. 随想录(用好自己的时间)
  7. linux下的C语言开发(进程等待)
  8. C语言和设计模式(责任链模式)
  9. 用汇编的眼光看C++(之算术符重载陷阱)
  10. 图片 button 去背景色_不会PS没关系,用Word更换证件照背景色只要10秒!