Los estilos de las cajas en CSS3

Las nuevas propiedades CSS3

De todas las novedades de CSS3, son las nuevas propiedades para el diseño de las cajas las que han generado un mayor entusiasmo y más reacciones de júbilo entre los diseñadores web. Todos soltaron un suspiro de alivio: ***por fin vamos a poder aplicar bordes redondeados, degradados, sombras y transparencias a las cajas "div"***.

Este párrafo tiene definido el atributo name, puede verificarlo viendo el código HTML. Si crea otro párrafo y le escribe usa el atributo name, también se le aplicará este estilo.

El tamaño de las cajas

1. Con CSS 2.1
   Como usted sabe, con CSS 2.1, el tamaño necesario para la visualización de una caja tiene en cuenta los márgenes (margin), los bordes (border), el espaciado (padding) y el contenido (width).
2. Con CSS3
   En CSS3, con la propiedad box-sizing, usted podrá indicar que los valores de border y de padding se incluyan en el tamaño de width. Esta propiedad acepta dos valores:
   
   • content-box: el ancho de la caja se calcula en función del tamaño del contenido, del borde y del espaciado, como en CSS 2.1. Se trata del valor predeterminado.
   • border-box: el ancho de la caja incluye el tamaño del contenido, del borde y del espaciado.