CSS 实现背景半透明
IE过渡滤镜 + CSS3 rgba 即可完美实现。
具体实现代码如下:
.transparent {
background:rgba(0, 0, 0, 0.3);
filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#4c000000', EndColorStr='#4c000000');
}
:root .transparent {
filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#00000000', EndColorStr='#00000000');
}
提示:IE9 支持 filter 与 rgba 属性,这会导致其背景透明度双倍叠加!
解决:使用 :root 伪类为 IE9 单独写 HACK 并将其透明度降为 0 即可。
CSS 实现背景半透明的更多相关文章
- css实现背景半透明文字不透明的效果
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- CSS实现背景透明/半透明效果的方法
全透明代码:{background:transparent} 半透明代码:{filter:alpha(opacity=80);-moz-opacity:0.8;width:auto !importan ...
- [小技巧]兼容IE6的纯CSS背景半透明文字不透明
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- css设置div等标签背景半透明
三种方式: 1. background-color: transparent; 直接设置背景为透明 2.这种是子元素也会跟着变成半透明 /* 背景半透明,1为不透明 */ opacity: 0.5; ...
- 兼容IE、Firefox的背景半透明内容不透明设置
首先要说明的是背景是内容的祖先元素.如果是兄弟节点那就没有必要记录这篇文章了. 记录一下,知其然也知其所以然. IE8-特点: 1.不支持"opcity:0.5;"这种写法,只支持 ...
- DIV背景半透明文字不半透明的样式
DIV背景半透明,DIV中的字不半透明 代码如下:<body bgcolor="#336699"> <div style="filter:alpha(o ...
- 【27前端】背景半透明rgba LESS实践
今天有看到司徒正美<背景半透明rgba最佳实践>的文章和里面推荐的一个在线工具CSS背景颜色属性值转换 . 于是联系到自己的less库,新技能Get. 内容如下: /*在你的less库中 ...
- CSS实现文字半透明显示在图片上方法
CSS实现文字半透明显示在图片上方法 在css中文字半透明我们会需要使用滤镜效果也就是css中的filter:alpha来实现了,下面来看两个文字显示在图片上并且半透明的例子. CSS让一行文字显示在 ...
- CSS的背景
CSS的背景 1. 背景颜色background-color div { background-color: 颜色值; } 一般情况下元素背景颜色默认是transparent(透明). 2. 背景图片 ...
随机推荐
- vsftpd给root设置访问权限
1:Linux下安装vsftpd之后,默认的配置是匿名用户可以登录,匿名帐户有两个:用户名:anonymous密码:空 用户名:ftp密码:ftp 2:如果要用匿名进行上传删除等操作需要配置其它参数. ...
- mysql数据库常用语句
关于mysql数据库常用命令的整理: 一:对于数据库的操作 show databases;显示当前用户下所有的数据库名称 use database_name;进入当前数据库 create databa ...
- javascript中new Date浏览器兼容性处理
看下面的代码 <script type="text/javascript"> var dt1 = new Date('2016-3-4 11:06:12'); aler ...
- git svn 简易同时使用
这个方法适合于新的一个git 仓库.假如你使用的git 是最新版本,git本身提供了 git svn命令. 1. 进入一个空的目录,初始化一个空的git仓库: git svn init svn://x ...
- SSM成功了
- 利用html模板生成Word文件(服务器端不需要安装Word)
利用html模板生成Word文件(服务器端不需要安装Word) 由于管理的原因,不能在服务器上安装Office相关组件,所以只能采用客户端读取Html模板,后台对模板中标记的字段数据替换并返回给客户端 ...
- 20160509-hibernate--继承映射
继承映射 对象模型(Java类结构) 一个类继承体系一张表(subclass)(表结构) 1.一个类继承体系一张表(subclass)(映射文件) <class name="Emplo ...
- anyConnect连接VPN后无法上网
最近想使用学校图书馆的VPN, 使用的是anyConnect的客户端.每次连接后都显示连接成功,但是马上就无法上网了. 开始以为是win10系统不兼容的问题,在虚拟机里面用win7测试可以成功,但是因 ...
- JavaScript 学习笔记: 扩充类型的功能
JavaScript 是允许给基本类型扩充功能的.例如,可以通过对Object.prototype增加方法,可以让该方法对所有的对象都可用. 这样的方式对函数,数组,字符串,数字,正则表达式和布尔值同 ...
- windows phone 网易云阅读hubtile效果实现
效果图 曾几何时,刚接触wp的时候做了一个类似的界面,不过是Rectangle实现的,还是一个个摆的..囧啊 现在感觉这种应该是用hubtile实现的,Toolkit(http://silverlig ...