Está en la página 1de 15

CSS3

CSS son las siglas de Hojas de estilo


en cascada y que sirve para dar
estilo a nuestra estructura creada en
HTML. CSS3 es la ltima versin
hasta la fecha y presenta como
principales caractersticas mayor
control sobre el estilo de los
elementos de nuestra pgina web y
mayor nmero de efectos visuales.
Atributo border-radius
La propiedad CSS border-radius permite
a los desarrolladores Web definir qu
tan redondeadas sern las esquinas. La
redondez de cada esquina est definida
usando uno o dos valores para el radio
que define su forma dependiendo si es
un crculo o una elipse.
Atributo Box-shadow
La propiedad CSS box-shadow describe
uno o ms efectos de sombra como una
lista separada por comas. Permite
proyectar una sombra difuminada en la
estructura de casi cualquier elemento.
Si un border-radius es especificado en
un elemento con un box shadow, el box
shadow asume las mismas esquinas
redondeadas.
Atributo Text-shadow
La propiedad text-shadow agrega
sombra al texto. Acepta una lista de
sombras separadas por coma, para
aplicarlas al texto y a la propiedad text-
decorations del elemento. Cada sombra
es especificada como un fset del texto,
junto con valores de color y radio de
difuminacin opcionales.
@Font-face
@font-face permite al autor especificar
fuentes online para visualizar en sus
pginas web. Al permitir a los autores
proporcionar sus propias fuentes,
@font-face elimina la necesidad de
depender del numero limitado de
fuentes de usuarios instaladas en sus
computadoras.
Gradiente
El tipo de datos <gradient> CSS indica
un CSS <image> hecho por una
transicin progresiva entre dos o ms
colores (Degradado). Un gradiente de
CSS no es un CSS <color> pero
tampoco hay una imagen con
dimensiones intrnsecas; es decir, que
no tiene tamao natural o preferido, ni
una relacin preferida.
rgba
La notacin RGBA es una manera de
especificar colores en la que se definen
cuatro valores. Los tres primeros son los
bien conocidos canales RGB (rojo, verde
y azul) y el cuarto parmetro es el canal
Alpha, que no es ms que el grado de
transparencia u opacidad del color. El
canal Alpha es un valor entre cero y
uno, siendo 0 totalmente transparente
y 1 totalmente opaco.
Hsl y hsla
HSL es el acrnimo de hue (matiz),
saturation (saturacin), lightness
(luminosidad), los coloreshslson
mucho ms intuitivos y mas fcil de
utilizar.
Adems de los cdigos hsl podemos
utilizar los cdigos hsla donde a,
exactamente como en el caso de los
colores rgba, representa el valor alpha.
outline
La propiedad CSS outline es una forma
reducida para establecer una o ms de
las propiedades individuales de
contorno outline-style, outline-width y
outline-color en una sola declaracin.
En la mayora de los casos el uso de
este atajo es preferible y ms
conveniente.
Border-image
La propiedad de CSS border-image
permite utilizar una imgen para definir
los bordes de los elementos. Esto hace
que dibujarlos sea ms simple y elimina
la necesidad de utilizar muchas cajas
en algunos casos.
Transform: scale
Especifica una operacin de escalado
2D descrita por [sx, sy].
La funcin CSS scale() modifica el
tamao del elemento. ste puede
aumentar o disminuir su tamao y as
como la cantidad de escala es definida
por un vector, ste puede hacer ms en
una direccin que en otra.
Transform: rotate
Define una operacin de rotacin 2D de
un elemento, especficando la cantidad
de grados (deg) que este rotar en
sentido de las macecillas del reloj
(segn lo especificado por la propiedad
transform-origen). La operacin
corresponde a la matriz [cos(angle)
sin(angle) -sin(angle) cos(angle) 0 0].
Transform: translate
Especifica una tanslacin 2D dada por
el vector [tx, ty]. Si ty no es
especficada, se asumir que su valor
es cero.
La funcin CSS de translate() mueve la
posicin del elemento en el plano. Esta
transformacin se caracteriza por un
vector cuyas coordenadas definen
cunto se mueve en cada direccin.
transition
Permite definir la transicin entre dos
estados de un elemento. Hay diferentes
estados que pueden ser definidos
utilizando pseudo-clases como :hover
o :active o aplicado dinmicamente
usando JavaScript.

También podría gustarte