LO NUEVO EN CSS3

La ms importante que aporta CSS 3, consiste en la incorporacin en su estructura de mdulos,

mecanismo que ayuda a mantener un mayor control sobre el estilo con el que se muestran los
elementos de las pginas, sin tener que recurrir a trucos, complicaban el cdigo de las web.
Estos mdulos contienen nuevas funcionalidades que se aaden a las ya existentes en la versin
anterior, CSS2. Es as como CSS3, permite aplicar estilos ms modernos a los diferentes
elementos de un sitio web. Sin utilizar ayuda de otros lenguajes.
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 borderimage, 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.