LO NUEVO EN CSS3

CSS es un lenguaje utilizado para especificar el aspecto de una pgina web

para diferentes dispositivos. CSS3 aade muchas capacidades nuevas a lo que
se tena con CSS2. Aunque an est en proceso de estandarizado y le queda
un largo camino por recorrer, ya se ha hecho un hueco al lado de HTML5 y
supone uno de los mayores adelantos en el diseo web en la actualidad.
La novedad ms importante que aporta CSS 3, consiste en la incorporacin de
nuevos mecanismos para mantener un mayor control sobre el estilo con el que
se muestran los elementos de las pginas, sin tener que recurrir a trucos o
hacks, que a menudo complicaban el cdigo de las web.
Novedades de CSS3
Existen muchas novedades en css3, por ello solo se nombraran los mas
representativos.
Efectos de texto: CSS3 incorpora nuevas propiedades para crear diseos de
texto ms atractivos. Entre todas ellas destaca text-shadow, la cual, como su
nombre indica, aade un efecto de sombra al texto. Su sintaxis es la siguiente:
text-shadow: h v blur color;
Las 2 primeras definen la posicin de la sombra, mientras las ltimas, la
magnitud del blur y el color de la sombra.

Bordes: Ahora podemos disear de manera sencilla bordes redondeados con

la propiedad border-radius, bordes formados por imgenes con border-image, y
sombras con box-shadow, entre otras opciones.
Animaciones: Tambin tenemos otra nueva funcin en CSS3 que permite
conseguir resultados similares a las animaciones creadas con Flash. Se trata
de la regla @keyframes, dentro de ella se encuentra el estilo css que define la
animacin. Adems es necesario asignar un nombre que identifique al
@keyframes, de este modo, se puede aplicar el efecto desde el objeto que
queramos.
Transformaciones 2D / 3D: Las transformaciones en css3 ofrecen la
posibilidad de cambiar el tamao y posicin de una figura con la utilizacin de
diversos mtodos y la propiedad transform. Algunos de los mtodos principales
son; rotate(), scale() y matrix() para transformaciones 2D; y rotate3d(),
matrix3d() y translate3d() para efectos 3D.

Transiciones: Este tipo de efectos permiten cambiar el estilo de un objeto de

manera progresiva. Para ello se utiliza el elemento transition, al cual le

asignamos las propiedades que deseamos cambiar y el tiempo de la transicin

en segundos. Por ejemplo, para cambiar la altura de un elemento en 5
segundos: transition: height 5s;
CSS3 media queries, permite a diseadores y desarrolladores crear estilos
que se adapten a dimensiones especficas de pantalla. Al utilizar media
queries, un simple documento HTML puede tener varias presentaciones dentro
de un rango de pantallas o dispositivos. Un diseador o un desarrollador puede
crear estilos que se apliquen selectivamente basados en las dimensiones de
una pantalla donde se despliegue el contenido. Por esta razn, se pueden
aplicar diferentes layouts basados en interfaces de tabletas, interfaces de
dispositivos mviles e interfaces de escritorio de un mismo documento HTML.