Pero CSS3 ya está aquí y también es muy impresionante; una prueba de ello son las barras o indicadores de progreso implementados bajo CSS3 que publicaron en CSS-Tricks.

ProgressBarr con CSS3 Barras de progreso implementadas con CSS3

En una página web, un código como el siguiente:

<div class="meter red">  <span style="width: 80%"></span>  </div>

muestra una barra de progreso indicando el 80% completado.

Todos los ejemplos publicados por CSS-Tricks se pueden descargar en un archivo ZIP que contiene sólo dos archivos: el HTML y el CSS3.

Echale una vistazo a estos ejemplos y al igual que yo quedarás impactado no sólo por los resultados finales (que también son impactantes), sino por la sencillez con que se pueden implementar en cualquier desarrollo web.

CSS3 Progress Bars

Sitio: css-tricks.com/css3-progress-bars

 

Genera gradients con CSS3

La especificación de CSS3 incorpora gradientes; CSS3 Gradient Generator permite generar el código CSS para implementar gradientes en navegadores basados en WebKit y Mozilla.

Para crear nuestros propios gradientes, sólo hay que elegir las opciones que muestra, entre ellas la dirección del gradiente y los colores. Mientras estamos trabajando en un botón nos va mostrando como va quedando. Para que podamos ver esta previsualización, tenemos que usar Safari, Chrome o Firefox 3.6 Beta.

Debajo del botón que muestra la previsualización, está código que tenemos que usar en la CSS.

CSS3 Gradient Generator

Sitio: gradients.glrzad.com

Por admin

Deja una respuesta