CSS3, please!

通过控制左侧对应的开关,动态改变此处的样式预览

/* -------------------------------------------------------------
      CSS3的跨浏览器的规则生成器
      ===================================================

	  在以下CSS文件中,您可编辑带有下划线的值,当您编辑任意值时,与其匹配都值可以自动生成,
      
      当右侧示例达到您想要的效果时,您可以把代码复制到您的样式表。
------------------------------------------------------------- */

/*                          {CSS3圆角 off} */
.box_round {
     -moz-border-radius: 12px; /* FF1+ */

  -webkit-border-radius: 12px; /* Saf3+, Chrome */
          border-radius: 12px; /* Opera 10.5, IE 9 */
}
  
/* */
/*                          {CSS3阴影 off} */
.box_shadow {
     -moz-box-shadow: 0px 0px 40px #ffffff; /* FF3.5+ */

  -webkit-box-shadow: 0px 0px 40px #ffffff; /* Saf3.0+, Chrome */
          box-shadow: 0px 0px 40px #ffffff; /* Opera 10.5, IE 9.0 */

              filter:  progid:DXImageTransform.Microsoft.dropshadow(OffX=0px, OffY=0px, Color='#ffffff'); /* IE6,IE7 */
          -ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=0px, OffY=0px, Color='#ffffff')"; /* IE8 */

}
  
/* */
/*                      {CSS3渐变背景 off} */

.box_gradient {
  background-image: -moz-linear-gradient(top, #444444, #999999); /* FF3.6 */
  background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #444444),color-stop(1, #999999)); /* Saf4+, Chrome */

            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#999999'); /* IE6,IE7 */
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#999999')"; /* IE8 */

}
  
/* */
/*                      {CSS3RGBA背景 off} */

.box_rgba {
  background-color: #B4B490;
  background-color: rgba(180, 180, 144, 0.6);  /* FF3+, Saf3+, Opera 10.10+, Chrome */
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#99B4B490',endColorstr='#99B4B490'); /* IE6,IE7 */

        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#99B4B490',endColorstr='#99B4B490')"; /* IE8 */
}
  
/* */
/*                              {CSS3旋转 on} */
.box_rotate {
     -moz-transform: rotate(7.5deg);  /* FF3.5+ */
       -o-transform: rotate(7.5deg);  /* Opera 10.5 */

  -webkit-transform: rotate(7.5deg);  /* Saf3.1+, Chrome */
             filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083);  /* IE6,IE7 */
         -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)"; /* IE8 */

}
  
/* */
 
@font-face {
  font-family: 'WebFont';
  src: url('myfont.eot');  /* IE6+ */

  src: local('☺'), 
        url('myfont.woff') format('woff'),  /* FF3.6 */
        url('myfont.ttf') format('truetype');  /* Saf3+,Chrome,Opera10+ */
}