zoukankan      html  css  js  c++  java
  • 兼容ie8 rgba()用法

    <!--[if IE]>

    <style type="text/css">

    .mark {

    background:transparent;

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#c80e92cb,endColorstr=#c80e92cb);

    zoom: 1;

    }

    </style>

    <![endif]-->

    DXImageTransform.Microsoft.gradient滤镜里的startColorstr参数值是#AARRGGBB形式的,其中的AA是代表不透明度的十六进制,00表示完全透明,FF就是全不透明,化成十进制的范围就是0~255,剩下的RRGGBB就是颜色的十六进制代码。例子中background: rgba(125, 0, 0, .3);表示的是30%不透明度的红色背景。如何把30%的不透明度转换成十六制呢?很简单,先计算#AA的的十进制x,x/255 = 3/10,解得x=3*255/10,然后再把x换算成十六进制,约等于4B。下面有rgba和IE下filter数值的转换,这样大家就不用计算了,直接参考数值就行。

    RGBa颜色还可以用于border,不过,不同的浏览器对于border的RGBa支持不太一样,不过唯一的不同是,Firefox在border的拐角处会出现叠加,比如透明度是0.4,那么在Firefox中,四个角的透明度会变成0.8,而支持RGBa的非FF浏览器不会出现这种情况。

    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

  • 相关阅读:
    HTML 标签
    HTML与CSS的关系
    用node搭建本地服务环境
    Windows平台下SVN安装配置及使用
    CSS Flex布局整理
    zepto 选中select option 的值
    Zepto tap 穿透bug、解决移动端点击穿透问题
    jquery 上下滚动显示隐藏
    es6学习笔记二:生成器 Generators
    es6学习笔记一:迭代器和for-of循环
  • 原文地址:https://www.cnblogs.com/codebook/p/5107548.html
Copyright © 2011-2022 走看看