CSS práctico

Permite la asignaci�n de estilos a estructuras, estados de los elementos o estados del propio documento, las cuales no deben estan definidas en la estructura del propio documento.

.�Pseudo-Clases

En el caso de los enlaces, algunos de ellos hacen referencia a p�ginas que ya han sido o no visitadas. No hay ninguna forma posible de poder formatear de forma diferente estos tipos de enlaces en HTML, para ello utilizamos unas estrucuturas virtuales que no se corresponden con ning�n objeto del documento HTML, conocidas como pseudo-clases.

En CSS1, hay s�lo tres pseudo-clases:

  • :link. Hace referencia a cualquier enlace no visitado de la p�gina.

  • :visited. Hace referencia a cualquier enlace ya visitado de la p�gina.

  • :active. Hace referencia al enlace en el que estamos haciendo click en este momento o estamos activando. En CSS1 s�lo se puede definir esta propidedad sobre los enlaces, mientras que en CSS2 esta propiedad se aplica a cualquier elemento.

.�Pseudo-Elementos

En CSS1, hay dos pseudo-elementos que son :first-letter and :first-line. Se utilizan para dar estilo a la primera letra de un elemento de bloque (un p�rrafo por ejemplo) y a su primera l�nea respectivamente. Ejemplo:

P:first-letter {color: red;}
P:first-line {color: gray;}

.�Restricciones en las Pseudo-Clases y los Pseudo-Elementos

Cuando aplicamos un pseudo-elemento s�lo podemos emplear en su definici�n, los siguientes estilos:

  • :first-letter

    • propiedades de las fuentes

    • fondos y colores

    • text-decoration

    • vertical-align (si float es none)

    • text-transform

    • line-height

    • margenes

    • padding

    • bordes

    • float

    • clear

  • :first-line

    • propiedades de las fuentes

    • fondos y colores

    • word-spacing

    • letter-spacing

    • text-decoration

    • vertical-align

    • text-transform

    • line-height

    • clear

En CSS1, no podemos combinar una pseudo-clase y un pseudo-elemento para la misma definici�n de estilo. Esto cambia en CSS2, aunque la sintaxis de definici�n es bastante r�gida.

COMPARTE ESTE ARTÍCULO

COMPARTIR EN FACEBOOK
COMPARTIR EN TWITTER
COMPARTIR EN LINKEDIN
COMPARTIR EN WHATSAPP