ie8下的透明 问题
团队里经常遇到,索性整理一起
是我们在前端开发中经常遇到的,在问题中经常遇到的两个问题是背景色透明和整体透明
先说下背景色透明,背景色透明,在现代浏览器中,可以用rgba颜色作为背景色。
简单介绍下rgba色,这个是在css3 出现的标准。所谓RGBA颜色,顾名思意就是R+G+B+A的颜色,再具体点就是RED+GREEN+BLUE+ALPHA的颜色,小写一下就是red+green+blue+alpha的颜色,翻译一下就是红+绿+蓝+Alpha透明的颜色。通过改变a的值来改变透明度。
background:rgba(200, 54, 54, 0.5);
这个颜色就是透明度为0.5的颜色背景,
如何处理兼容如果想要IE也支持颜色透明,那就要动用IE的私有滤镜
FILTER:progid:DXImageTransform.Microsoft.Gradient
兼容写法实例:
background:rgba(0,0,0,0.5);
filter:progid:DXImageTransform.Microsoft.gradient(startcolorstr=#7F000000,endcolorstr=#7F000000);
这里的7F是十六进制的表达方式,00 为最小的透明度(完全透明)FF为最大透明值(完全不透明)
下面说下整体透明
整体透明区别于背景色透明就是整个元素的都是透明的,在css3新的标准中为
opacity: .5;
兼容IE的写法
/* IE 4-9 */
filter:alpha(opacity=50);
/*This works in IE 8 & 9 too*/
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
/*IE4-IE9*/
filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
ie8下的透明 问题的更多相关文章
- ie8下jquery改变PNG的opacity出现黑边,ie6下png透明解决办法
目前互联网对于网页效果要求越来越高,不可避免的用到PNG图片,PNG分为几种格 式,PNG8 PNG24 PNG32,其中最常用的,也是显示效果和大小比较适中的则是PNG24,支持半透明,透明,颜色也 ...
- 真~让IE8支持background: rbga; ,IE8下兼容rgba颜色的半透明背景
IE8下兼容rgba颜色的半透明背景 这样的标题在百度和google搜索下很多篇文章,讲解IE8下兼容rgba的. 这些文章全部都是使用IE下的filter来使元素透明,但是这个里面会有bug. 它们 ...
- (转)解决png图片在IE6下不透明的方法
来源于:http://xzl52199.blog.163.com/blog/static/95206446201142174540220/ 一.传统的JavaScript方法 思路: 1.一个专门解决 ...
- ie8下jquery改变PNG的opacity出现黑边
复制网上的,没有他们那个类型的博客,所以就直接复制了 这些天在做一个效果,鼠标经过,PNG图片由透明变成不透明,jquery代 码:$(element).animate({"opacity& ...
- 使用ie的filter来解决rgba在IE8下没有效果的问题
使用ie的filter来解决rgba在IE8下没有效果的问题,css代码如下: background: rgba(255,255,255,0.1); filter:progid:DXImageTran ...
- IE8下导入EXCEL数据传到客户端以附件下载
IE8下导入EXCEL数据传到客户端以附件下载方式出现,而不显示数据,解决方法:以text/html格式返回. HttpResponseMessage message = new HttpRespon ...
- echarts在IE8下遮挡其他组件的问题
echarts的图在IE8下会浮在上层遮挡住其他组件,解决方式是页面中引入 <meta http-equiv="X-UA-Compatible" content=" ...
- jquery.validate.js在IE8下报错不运行
因为项目要表单验证,所以特意去找了jquery.validate这个应该是jquery官方团队出品的表单验证插件. 实际应用时,却在IE8调试时碰到了问题. 从jquery.validate官网下载了 ...
- ie8下背景图片平铺问题
IE9+及其他浏览器实现背景图片平铺可能需要一个属性就可以background-size:100%/cover; 但是ie8下background-size是不兼容的,因此我们需要用到滤镜,来解决背景 ...
随机推荐
- yii2 去掉index.php的方法
1.开启apache-rewrite 在Windows下,我们一般使用的是Administrator账号,所以启用这两项非常简单: 在[Apache安装目录]/conf/httpd.conf中找到 # ...
- [Head First Python]5. summary
1- "原地"排序-转换后替换 >>> list = [2,1,3] >>> list.sort() >>> list [1, ...
- information_schema.optimizer_trace学习
information_schema.optimizer_trace 用于追踪优化器的优化过程:通常来说这张表中是没有数据的,要想开户追踪要把 @@session.optimizer_trace='e ...
- linux设置虚拟内存(swap)解决mysql因内存不足挂掉的故障
mysql错误日志显示: InnoDB: mmap(137363456 bytes) failed; errno 122016-03-01 01:38:42 13064 [ERROR] InnoDB: ...
- Hibernate中3种结果转换的详细说明(转)
Hibernate中3种结果转换的详细说明 在hibernate使用的过程中.我们通常需要对结果进行解释. Hibernate为我们提供了以下3种解释方法: Transformers.ALIAS_TO ...
- 在Git中一定要关注的crlf自动转换
GitHub 第一坑:换行符自动转换 如果你已经做出了错误的选择,也不需要重新安装,可以直接使用命令行来修改设置.很简单,直接打开这货自带的命令行工具 Git Bash,输入以下命令,再敲回车即可: ...
- hash算法-time33算法
http://my.oschina.net/freegeek/blog/325531 http://www.cnblogs.com/napoleon_liu/articles/1911571.html ...
- 关于WPF中承载 ArcGIS控件。
原文 http://www.cnblogs.com/zoe-j/archive/2011/05/18/2050208.html 之前就做过WPF的应用,之前承载的MapGIS的二次开发控件,今天写一下 ...
- Linux和windows动态库
转载:http://www.cnblogs.com/chio/archive/2008/11/13/1333119.html 态链接库技术实现和设计程序常用的技术,在Windows和Linux系 统中 ...
- Eclipse文件覆盖问题
window-preferences-General-Search找到第一行的一个选项 Reuse editors to show matches他的意思是说在同一个编辑里面显示匹配的文件,如果后面有 ...