CSS3 RGBA 属性高级用法

核心提示:讲一下CSS3里目前用的比较广的RGBA属性的高级使用方法。这个属性的兼容问题比较简单,IE8已经支持这个属性,IE6和IE7也可以通过 hack支持。RGBA和CSS2里的RBG属性差不多,只是RGBA属性多了一个透明度的定义,CSS3标准里对RGBA属性的解释如下:

讲一下CSS3里目前用的比较广的RGBA属性的高级使用方法。这个属性的兼容问题比较简单,IE8已经支持这个属性,IE6和IE7也可以通过 hack支持。RGBA和CSS2里的RBG属性差不多,只是RGBA属性多了一个透明度的定义,CSS3标准里对RGBA属性的解释如下:

/* 基本语法 */
em { color: Rgba(red,green,blue,opacity) }
/* 举例 */
em { color: rgba(255,0,0,1) }/* 红色,不透明 */
em { color: rgba(100%,0%,0%,1) } /* 同上 */

RGBA的强大之处在于,通过对透明度的定义和不同层的颜色混合可以呈现出更多的颜色,就像颜料的混合一样

http://24ways.org/examples/have-a-field-day-with-html5-forms/24ways-form.html

CSS3 RGBA 属性高级用法_第1张图片

 

圆角CSS

		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-khtml-border-radius: 5px;
		border-radius: 5px;
background: rgba(255,255,255,.3);
<div style="background:none repeat scroll 0 0 #9CBC2C; border-radius:5px 5px 5px 5px; counter-reset:fieldsets;">
 <ul>
  <li style="background: rgba(255,255,255,0.3);border-color: rgba(255, 255, 255, 0.6);">
   test rega
  </li>
 </ul>
</div>

   

你可能感兴趣的:(c,css,IE,div,scroll)