CSS对IE使用背景透明 实现 rgba 效果

height:35px;
background: -webkit-gradient(linear,left top,left bottom,from(rgba(68,102,113,0.9)),to(rgba(46,74,83,0.9)));
background: -moz-linear-gradient(top, rgba(68,102,113,0.9), rgba(46,74,83,0.9));
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#5A446671', endColorstr='#5A2E4A53'); /* IE6,IE7 */
-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#E6446671', endColorstr='#E62E4A53')"; /* IE8 */

对 IE 的 filter 的 gradient 渐变滤镜中的颜色参数比常见的多了两位,因为 前两位是透明度的十六进制数值

例如:



#E62E4A53 中的 E6 代表透明度为 opacity 的 0.9, 2E4A53 才是真正的色彩值



透明度的计算方法:



256*0.9=230.4 取 230 通过计算转换为 十六进制 E6



(可以用windows自带的计算器选择程序员类型计算出来)



star 和 end 的颜色可以相同,这样就可以背景半透明了,



另外说明: IE7 需要指定高度 height 时背景渐变才会生效,否则不会显示的

CSS中RGBA的兼容方法以及透明度计算方法的更多相关文章

  1. css中添加屏幕自适应方法(rem)

    css中添加屏幕自适应方法(rem) 只需要在公共css文件中添加下面代码:设计稿以750px,基础字体为20px为例,兼容性高,使用过程中px转化为rem即可 /*竖屏*/ @media scree ...

  2. css中的一些兼容问题

    浏览器兼容 为什么会有兼容问题? 由于市场上浏览器种类众多,而不同浏览器其内核亦不尽相同,所以各个浏览器对网页的解析就有一定出入,这也是导致浏览器兼容问题出现的主要原因,我们的网页需要在主流浏览器上正 ...

  3. css中的毛玻璃(不是透明度) 简单文档

    其实毛玻璃很简单 只需要在css中加入 backdrop-filter:blur(8px); 8px是模糊力度 注意:使用该方法前需要设置背景不能是透明(如果是显示这个元素下面的图像记得半透明,例子就 ...

  4. CSS中背景图片定位方法

    转自:http://www.ruanyifeng.com/blog/2008/05/css_background_image_positioning.html 作者: 阮一峰 日期: 2008年5月 ...

  5. CSS中的各种居中方法总结

    CSS中的居中可分为水平居中和垂直居中.水平居中分为行内元素居中和块状元素居中两种情况,而块状元素又分为定宽块状元素居中和不定宽块状元素居中.下面详细介绍这几种情况. 一.水平居中 1.行内元素居中 ...

  6. CSS 中的字体兼容写法:用CSS为英文和中文字体分别设置不同的字体

    font-family的调用方法: font-family:Arial,'Times New Roman','Microsoft YaHei',SimHei; font:bold 12px/.75em ...

  7. (转)HTML&CSS——background: url() no-repeat 0 -64px;CSS中背景图片定位方法

    http://blog.csdn.net/oscar92420aaa/article/details/51304067 CSS中背景图片的定位,困扰我很久了.今天总算搞懂了,一定要记下来. 在CSS中 ...

  8. css 中 div垂直居中的方法

    在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...

  9. HTML&CSS——background: url() no-repeat 0 -64px;CSS中背景图片定位方法

    CSS中背景图片的定位,困扰我很久了.今天总算搞懂了,一定要记下来. 在CSS中,背景图片的定位方法有3种: 1)关键字:background-position: top left; 2)像素:bac ...

随机推荐

  1. UE4新手编程之创建C++项目

    虚幻4中常用的按键和快捷键 虚幻4中有一些按键和快捷键很常用,牢记它们并运动到实际的项目开发中,将会大大地提高你的工作效率和使得工作更简便快捷.下面将列举它们出来: 按键   动作  鼠标左键   选 ...

  2. openresty 前端开发轻量级MVC框架封装一(控制器篇)

    通过前面几章,我们已经掌握了一些基本的开发知识,但是代码结构比较简单,缺乏统一的标准,模块化,也缺乏统一的异常处理,这一章我们主要来学习如何封装一个轻量级的MVC框架,规范以及简化开发,并且提供类似p ...

  3. Android之WebView网页滚动截图

    WebView 网页滚动截屏,可对整个网页进行截屏而不是仅当前屏幕哦! 注意若Web页面存在position:fixed; 的话得在调用前设置为 position:absolute; 哦,否则会出现很 ...

  4. CodeForces 384C Milking cows

    水题. 对于两个$0$,肯定是先删去后面的$0$,再删去前面的$0$. 对于两个$1$,肯定是先删去前面的$1$,再删去后面的$1$. 对于一个$0$和一个$1$,无论先删哪一个,对答案做出的贡献都是 ...

  5. 《Hexo+github搭建个人博客》

    <Hexo+github搭建个人博客> 文/冯皓林 完稿:2016.4.22-2016.4.23 注意:本节教程只针对Windows用户.本教程由无人赞助,赞助写出. <Hexo+g ...

  6. 校门外的树 OpenJudge 1.6.06

    06:校门外的树 总时间限制:  1000ms 内存限制:  65536kB 描述 某校大门外长度为L的马路上有一排树,每两棵相邻的树之间的间隔都是1米.我们可以把马路看成一个数轴,马路的一端在数轴0 ...

  7. 前端——HTML笔记-One

    一.HTML简介 html即超文本标记语言,指页面内可包含图片.链接,甚至音乐.程序等非文字元素,而标记语言:即标记(标签)构成的语言. 什么是标签: 标签中单词不可以数字开头. 标签不区分大小写.& ...

  8. C# 无边框窗口实现拖动

    原文地址:http://blog.csdn.net/sky___ice/article/details/11533321 Form1.Designer.cs: // //Form1 // this.M ...

  9. Linux sendmail 详解

    Internet上最基本的服务,现在应该大部分人都有自己的邮箱吧,用的人多,但理解的人估计没多少,我自己以前也是常常用,但对其原理并不操心.今天就来操心下,进行个小总结 一.邮件服务的基本流程     ...

  10. YYKit笔记之FPS

    FPS计算方法 FPS是Frame per second的缩写,即每秒的帧数.这一术语广泛的应用于计算机图形学,视频采集,游戏等. CADisplayLink CADisplayLink是一个能让我们 ...