Cómo Configurar El Color Del Enlace

Tabla de contenido:

Cómo Configurar El Color Del Enlace
Cómo Configurar El Color Del Enlace
Anonim

Si el navegador del visitante del sitio web no encuentra ninguna indicación del diseño de color de los hipervínculos en el código de la página, entonces utiliza los valores predeterminados. Estos valores son de color azul para los enlaces pasivos, rojo para los enlaces activos (al pasar el mouse) y el tinte de color magenta para los enlaces ya visitados. Este esquema de color no siempre se combina con el esquema de color del diseño de la página, por lo tanto, generalmente se incluye un bloque de descripciones de estilo de enlace en el código.

Cómo configurar el color del enlace
Cómo configurar el color del enlace

Instrucciones

Paso 1

Cree un conjunto de instrucciones para el navegador que describa los colores de los enlaces en tres estados. Por ejemplo, puede verse así: a: link {color: Red;}

a: visitado {color: amarillo;}

a: hover {color: Orange;} Aquí, la "a" al principio de cada línea se denomina "selector" y especifica la etiqueta a la que el navegador debe aplicar la descripción de estilo entre llaves. "A" es la etiqueta de hipervínculo. La palabra agregada al selector separada por dos puntos se denomina "pseudoclase", que el navegador usa para determinar a qué estado de enlace pertenece el estilo entre llaves. enlace coincide con un enlace normal, visitó un enlace que ya se ha visitado y coloque el cursor sobre un enlace cuando el cursor se desplaza sobre él. Los colores asignados al parámetro de color dentro de las llaves se pueden especificar por el nombre del tono de color o por su código hexadecimal.

Paso 2

Si necesita asignar diferentes colores a diferentes grupos de enlaces en la página, asigne a cada grupo su propia designación ("clase") y haga una descripción separada de los estilos para cada uno de ellos. Por ejemplo, nombre un grupo LinksRed y el otro LinksGreen. Entonces, la descripción del estilo se verá así: a. LinksRed: link {color: Red;}

a. LinksRed: visitado {color: Yellow;}

a. LinksRed: hover {color: Orange;} a. LinksGreen: link {color: Green;}

a. LinksGreen: visitado {color: DarkGreen;}

a. LinksGreen: hover {color: Lime;} Y en las etiquetas de enlaces de cada grupo, debes indicar a qué clase pertenecen. Por ejemplo: enlace rojo

Enlace verde

Paso 3

Estas instrucciones están escritas en CSS (Hojas de estilo en cascada), por lo que deben colocarse dentro de una etiqueta de estilo que las separe de otras instrucciones en el código fuente de la página, escritas en HTML (Lenguaje de marcado de hipertexto):

a. LinksRed: link {color: Red;}

a. LinksRed: visitado {color: Yellow;}

a. LinksRed: hover {color: Orange;} a. LinksGreen: link {color: Green;}

a. LinksGreen: visitado {color: DarkGreen;}

a. LinksGreen: hover {color: Lime;}

Paso 4

Coloque el bloque de descripción de estilo de enlace preparado en la parte del encabezado del código fuente de la página; está delimitado por las etiquetas y.

Recomendado: