Cómo Cambiar El Color De Un Hipervínculo

Tabla de contenido:

Cómo Cambiar El Color De Un Hipervínculo
Cómo Cambiar El Color De Un Hipervínculo

Video: Cómo Cambiar El Color De Un Hipervínculo

Video: Cómo Cambiar El Color De Un Hipervínculo
Video: Cambio de color en los hipervínculos de Word 2024, Mayo
Anonim

El atributo Hojas de estilo en cascada (CSS) se utiliza con mayor frecuencia para cambiar el color de los hipervínculos en las páginas web. Las soluciones menos funcionales a este problema se encuentran en el lenguaje HTML (Lenguaje de marcado de hipertexto - "lenguaje de marcado de hipertexto").

Cómo cambiar el color de un hipervínculo
Cómo cambiar el color de un hipervínculo

Es necesario

Conocimientos básicos de lenguajes HTML y CSS

Instrucciones

Paso 1

Prepare un bloque de estilo para hipervínculos. En su forma más simple, podría verse así: a {color: Green} Aquí "a" se llama "selector", lo que indica que la descripción de estilo entre paréntesis debe aplicarse a todas las etiquetas de enlace en el documento. El verde define el color del enlace; esta es una definición de color muy aproximada y rara vez se usa. Con mucha más frecuencia, se agrega una "pseudo-clase" al selector "a"; es una etiqueta que le permite especificar el estilo del enlace en tres estados diferentes.

Paso 2

Utilice la pseudoclase de enlace para diseñar el estado normal (inactivo) del enlace. Puede tener este aspecto, por ejemplo: a: link {color: Green}

Paso 3

Utilice el hover de pseudo-clase para especificar cómo debe aparecer el enlace al hover. Por ejemplo: a: hover {color: Lime}

Paso 4

Utilice la pseudoclase visitada para describir el estilo de un enlace ya visitado. Por ejemplo: a: visitado {color: DarkGreen}

Paso 5

Combine los tres estados en un bloque de descripción de estilo. El aspecto del código HTML que contiene descripciones CSS de estilos puede, por ejemplo, verse así:

a: enlace {color: verde}

a: visitado {color: DarkGreen}

a: hover {color: Lime}

Aquí, las etiquetas de estilo HTML de apertura y cierre le dicen al navegador dónde comienzan y terminan las descripciones de estilo, y entre ellas hay una descripción del comportamiento del enlace en tres estados.

Paso 6

La muestra utilizada anteriormente muestra solo las características del color, pero se pueden incluir otros atributos en la descripción. Por ejemplo, si el diseño de la página requiere que el enlace no esté subrayado en el estado normal (inactivo), sino subrayado cuando se pasa el cursor sobre el cursor, entonces el código se puede modificar de la siguiente manera:

a: enlace {color: verde; decoración de texto: ninguna;}

a: visitado {color: DarkGreen; decoración de texto: ninguna;}

a: hover {color: Lima; decoración de texto: subrayado;}

Paso 7

Si desea cambiar el color de solo algunos enlaces en la página y dejar el resto con la configuración predeterminada, agregue el atributo de clase a la etiqueta de cada enlace que se cambia. Por ejemplo, asigne el nombre newLinks a esta clase de hipervínculo. Entonces, la etiqueta del enlace puede verse así: enlace de texto Se debe agregar el mismo nombre de clase a la descripción del estilo:

a.newLinks: link {color: Green; decoración de texto: ninguna;}

a.newLinks: visitado {color: DarkGreen; decoración de texto: ninguna;}

a.newLinks: hover {color: Lime; decoración de texto: subrayado;}

Paso 8

Coloque el código de descripción de estilo preparado a partir de los ejemplos descritos anteriormente en el encabezado de la página, entre las etiquetas y. Si es necesario, agregue un atributo de clase a las etiquetas de enlace con el nombre utilizado en las descripciones de estilo. Luego guarde la página modificada y se completará el procedimiento para cambiar el color de los hipervínculos.

Recomendado: