Nuevo Draft de CSS 3 (Backgrounds and Borders)

Hace unos minutos fue publicado en nuevo borrador de CSS 3 acerca de borders y background.

Para mi la especificación de CSS 3 es uno de los pasos más importantes hacia una mejor web, con esa especificación se podrán hacer cosas increíbles en diseño web, con un marcado limpio y sin necesidad de hacks.

¿Te imaginas poder usar varias imágenes de fondo para un mismo elemento y manejarlas a tu antojo?, ¡y que me dices de usar una imagen como borde!

¿Suena bien?, entonces no lo puedes dejar de leer.

Este borrador básicamente describe las siguientes propiedades de CSS:

• Background properties

• 1. Layering multiple background images
  2. The ‘background-color’ property
  3. The ‘background-image’ property
  4. The ‘background-repeat’ property
  5. The ‘background-attachment’ property
  6. The ‘background-position’ property
  7. The ‘background-clip’ property
  8. The ‘background-origin’ property
  9. The ‘background-size’ property
  10. The ‘background-break’ property
  11. The ‘background’ shorthand property
  12. The background of the canvas

• Border properties

• 1. The ‘border-color’ properties
  2. The ‘border-style’ properties
  3. The ‘border-width’ properties
  4. The ‘border-image’ property
  5. The ‘border-radius’ properties
  6. The ‘border-break’ property
  7. The ‘border-top’, ‘border-bottom’, ‘border-right’, ‘border-left’, and ‘border’ properties
  8. The ‘box-shadow’ property

Tiene cosas muy interesantes y el código está muy bien explicado (con ejemplos), me gustó mucho su uso de imágenes en lo referente al box model, así que deberías darle una mirada: CSS Backgrounds and Borders Module Level 3

Comentarios

deja un comentario

1. Jj

   Los más esperados por mí son 'border-image', 'border-radius' y 'box-shadow', ya no mas rompecabezas de imágenes! Me parece que es de lo que más se extraña en el día a día. Sin embargo todo el spec está genial.

   Ojalá mis hijos puedan diseñar con él :).

2. waldo

   te felicito por esta pagia,una de las mejores para consulta que he encontrado.la leo desde hace una semana,llevo 7 meses aprendiendo lenguaje html y css por iniciativa propia,(no estudio programacion ni diseño de forma "oficial")empece como una curiosidad y no paso un dia sin aprender algo nuevo¿que le recomendarias a un "aspirante"?

   pagina recomendada para entender un poco mas: http://www.effectivetranslations.com/stupidtables/everything_es.html

3. Germán

   @Jj CSS 3 va a ser genial, por mi parte estoy más interesado en los backgrounds que en los borders.
   No creo que tengas que esperar tanto para empezar a usarlos ;)

   @Waldo Gracias!, si he visto la página de stupid tables, es muy buena, hasta la he enlazado en algún artículo sobre tablas.
   Te podría recomendar 2 cosas:

   1.- Mira este artículo: (http://aprendiendoweb.com/2008/08/donde-comprar-libros-de-diseno-web-html-css) si sabes inglés busca esos libros.

   2.- Compra un hosting y un dominio y empieza a practicar (pienso hacer un post muy pronto acerca de eso, con un código de descuento para Hosting.)

4. lluis

   Hola, tengo una duda de posicionamento de background y llevo un buen rato buscando en google:

   Quisiera posicionar el origen de la imagen de background empezando por la parte inferior izquierda de la imagen. Desde siempre las imagenes empiezan por la parte superior izquierda de las cajas o divs y se van repitiendo a partir de ese origen.

   Mi pregunta es, es posible cambiar ese origen y que las imagenes empiezen desde la parte inferior de la caja en lugar de la superior?

   Gracias.