Búsqueda personalizada
 
 
 
 
Transformaciones 2D: mltiples transformaciones en forma simultanea
   

La sintaxis de css3 nos permite definir en la propiedad transform mltiples transformaciones en forma simultanea (debemos dejar al menos un espacio en blanco entre cada llamada a una funcin de transformacin):

Elemento { 
     transform: rotate(grados) 
                scale(valorx ,valory) 
                translate(valorx ,valory) 
                skew(gradosx ,gradosy); 
}

Por ejemplo apliquemos mltiples transformaciones a un recuadro:

#recuadro1{
  -moz-transform: rotate(15deg) scale(0.9,0.6) translate(10px,10px) skew(5deg,0deg);
  -ms-transform: rotate(15deg) scale(0.9,0.6) translate(10px,10px) skew(5deg,0deg);
  -webkit-transform: rotate(15deg) scale(0.9,0.6) translate(10px,10px) skew(5deg,0deg);
  -o-transform: rotate(15deg) scale(0.9,0.6) translate(10px,10px) skew(5deg,0deg);
  transform: rotate(15deg) scale(0.9,0.6) translate(10px,10px) skew(5deg,0deg);
  border-radius: 20px;  
  background-color:#ddd;
  width:200px;
  padding:10px;
}

Recuadro 1

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec,

 
 
 
       

¿Quienes somos?

Condiciones de uso

Publicidad

Privacidad de la informacion