Blog sobre Accesibilidad Web, diseño Web, SEO y recursos gratis en la Web

domingo, 1 de mayo de 2011

Un editor online de CSS3

CSS3 Generator es una aplicación Web que te hace más fáciles las cosas para editar algunos básicos de CSS3.

Como ser:
  • border-radius
  • box-shadow
  • background gradient
  • opacity
Este generador permite personalizar algunos aspectos antes de obtener el código.


En mis pruebas, el CSS obtenido, se ve así:

-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
/*IE DOES NOT SUPPORT BORDER RADIUS*/
-moz-box-shadow:0px 0px 2px #000000;
-webkit-box-shadow:0px 0px 2px #000000;
box-shadow:0px 0px 2px #000000;
/*IE DOES NOT SUPPORT BLUR PROPERTY OF SHADOWS*/
background: -moz-linear-gradient(top, #ffffff, #000000);
background: -webkit-gradient(linear, center top, center bottom, from(#ffffff), to(#000000));
background: -o-linear-gradient(top, #ffffff, #000000);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#000000');
/*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/
/*Element must have a height (not auto)*/
/*All filters must be placed together*/
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#000000')";
/*Element must have a height (not auto)*/
/*All filters must be placed together*/
background: linear-gradient(top, #ffffff, #000000);
/*--IE9 DOES NOT SUPPORT GRADIENT BACKGROUNDS--*/
opacity:0.39;
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=39);
/*-ms-filter must come before filter*/
filter: alpha(opacity=39);
/*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/
/*All filters must be placed together*/


Sitio Web | CSS3 Generator

Share:

Publicidad

Estadísticas

A cotidiano, me siguen