背景透明文字不透明的最佳方法兼容IE(以背景黑色透明度0.5为例)
以背景黑色,透明度0.5举例为大家详细介绍下关于背景透明,文字不透明的最佳方法同时兼容IE,具体实现如下,感兴趣的朋友可以参考下哈希望对大家有所帮助
以背景黑色,透明度0.5举例
非IE:background:rgba(0,0,0,0.5);
IE: filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f000000,endColorstr=#7f000000);
IE: filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#75000000',endColorstr='#75000000')
PS:#7f000000 其中7f是透明度0.5转换成16进制的数值,000000是黑色的16进制数值
具体数值转换可以参考
rgba 和IE下filter数值的转换
rgba 透明值 IEfilter值
| 0.1 | 19 |
| 0.2 | 33 |
| 0.3 | 4C |
| 0.4 | 66 |
| 0.5 | 7F |
| 0.6 | 99 |
| 0.7 | B2 |
| 0.8 | C8 |
| 0.9 | E5 |
直接取整计算的,没有进位直接舍去
alpha*255再转换成16进制即可
背景透明文字不透明的最佳方法兼容IE(以背景黑色透明度0.5为例)的更多相关文章
- css背景透明文字不透明
测试背景透明度为0.3.文字不透明: background-color: #000; /* 一.CSS3的opacity */ opacity: 0.3; /* 兼容浏览器为:firefox,chro ...
- CSS3实现背景透明文字不透明
最近遇到一个需求,如下图,input框要有透明效果 首先想到的方法是CSS3的 opacity属性,但事实证明我想的太简单了 这个属性虽然让input框有透明效果,同时文字和字体图标也会有透明效果,导 ...
- css实现背景透明文字不透明
设置元素的透明度: -moz-opacity:0.8; /*在Firefox中设置元素透明度 filter: alpha(opacity=80); /*ie使用滤镜设置透明 但是当我们对一个标 ...
- css3背景透明文字不透明
在 FF/Chrome 等较新的浏览器中可以使用css属性background-color的rgba轻松实现背景透明,而文字保持不透明.而IE6/7/8浏览器不支持rgba,只有使用IE的专属滤镜fi ...
- div半透明背景,文字不透明
background: rgba(255, 255, 255, 0.8) !important; /* IE无效,FF有效 */ background: #fff; filter: alpha(opa ...
- html 背景透明文字不透明
.alpha{ width: 100px; height: 100px; color: #fff; background: rgba(0, 0, 0, .3); filter: progid:DXIm ...
- [小技巧]兼容IE6的纯CSS背景半透明文字不透明
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- css实现背景半透明文字不透明的效果
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- CSS实现Div透明,而显示在上面的文字不透明,但也可看到显示在下面的图片内容
CSS实现Div透明,而显示在上面的文字不透明,但也可看到显示在下面的图片内容,DiV透明其实挺简单,主要是为background定义opacity属性,一般这个是最大值是1,数值越接近1,则越不透明 ...
随机推荐
- [Unity菜鸟] Unity鼠标双击,鼠标函数整理(未完)
1. 鼠标双击 void OnGUI() { Event Mouse = Event.current; if (Mouse.isMouse && Mouse.type == Event ...
- SGU111 Very simple problem
多少个平方数小于等于X,二分. PS:java BigInteger. import java.util.*; import java.math.*; public class Solution { ...
- R语言中的箱图介绍 boxplot
画箱图的函数: boxplot()##help(boxplot)查询具体用法 图例的解释: 如下图,是两个简单的箱图. 中间的箱子的上下边,分别是第三,一个四分位数. 中间的黑线是第二四分位数(中 ...
- 制作计算器的代码(C#)
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...
- sublime打开文件时自动生成并打开.dump文件
GBK Encoding Support 没有安装前打开ASNI格式编码文件会乱码,安装成功重启则可以打开正常 关于.dump文件生成的解释: 当打开一个非utf-8格式且包含汉字的文件时,subli ...
- 如何写mysql的定时任务
什么是事件: 一组SQL集,用来执行定时任务,跟触发器很像,都是被动执行的,事件是因为时间到了触发执行,而触发器是因为某件事件(增删改)触发执行: 查看是否开启: show variables li ...
- 如何查看你的 memcached 的状态
最近略忙,好久没有更新博客了,已长草,今天来除下草,好了,不废话了,开始! 现在很多web服务都会用到 memcached ,如何知道你的 memcached 是否正常工作,命中率如何呢,本文简单介 ...
- 浏览器以外的Javascript
浏览器外要运行javascript的代码,同样需要这个东西. ie老版本的JScript,ie9以后的Chakra,mozilla的SpiderMonkey,chrome的v8,Safari的Nitr ...
- acdream LCM Challenge (最小公倍数)
LCM Challenge Time Limit: 2000/1000MS (Java/Others) Memory Limit: 128000/64000KB (Java/Others) Su ...
- 基于VPN搭建混合云架构需要考虑的网络因素
Joy Qiao from MSFT Wed, Jan 21 2015 8:44 AM 很多用户在搭建混合云架构时,会使用到微软Azure虚拟网络中的 VPN功能,来实现Azure中的虚拟网络与用户 ...