码迷,mamicode.com
首页 > Web开发 > 详细

CSS3 -- 透明色(rgba)

时间:2015-05-12 17:04:49      阅读:588      评论:0      收藏:0      [点我收藏+]

标签:

1、rgba 描述

  rgb:红r、绿g、蓝b

  rgba:红r、绿g、蓝b、透明度Alpha

  取值:

    r、g、b值:正整数(0 ~ 255) | 百分数( 0.0% ~ 100.0%);(超出范围的数值将被截至其最接近的取值极限。并非所有浏览器都支持使用百分数值。)

    a透明度值:取值0~1之间;(不可为负)

2、rgba 兼容

技术分享

3、rgba 用法

  rgba:制作透明色(透明背景色、透明边框色、透明前景色等),

  opacity:在CSS2中制作背景色通常用到,但用它制作边框色或前景色的话,则存在问题。

  在CSS2中 兼容 写法:

/* IE5 - 7 */
filter: alpha(opacity=80); 
/* IE 8 */
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; 
/* Everyone else */
opacity: 0.8;

  CSS3中 兼容写法:

background: rgb(0,0,0); /*The Fallback color,这里也可以使用一张图片来代替*/
background: rgba(0, 0, 0,0.5);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr=#80000000,endColorstr=#80000000)"; /*Filter for IE8 */    
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr=#80000000, endColorstr=#80000000); /*Filter for older IEs */

CSS3 -- 透明色(rgba)

标签:

原文地址:http://www.cnblogs.com/libinblog/p/4497854.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!