Tecnología

Inicio

Cómo hacer hipervínculos En Xhtml Los vuelcos

Impresionar a sus visitantes del sitio mediante la adición de efectos de conversión a las páginas Web. Cascading Style Sheets le permiten modificar la apariencia de un hipervínculo sin utilizar código JavaScript. Muchos navegantes de Internet están familiarizados con el efecto "underline". El efecto de subrayado se produce cuando el explorador pone de relieve un hipervínculo al mover el ratón sobre él. El uso de CSS, puede agregar efectos de conversión adicionales a las páginas Web XHTML.

Instrucciones

1 Abra el documento XMTL el Bloc de notas o un editor HTML.

2 Agregue este código a la sección de "cuerpo" del documento:

<a href= "http://www.abc.com&quot; class="underline"> Subrayado Efecto Resaltado </a>
<a href="http://www.xyz.com&quot; class="highlight"> destacado Efecto Resaltado </a>

Esto crea dos hipervínculos. Cada hipervínculo hace referencia a una clase CSS diferente.

3 Agregue este código a la sección de "cabeza" del documento:

ESTILO type = "text / css">
a.underline: link {text-decoration: none}
a.underline: activa {background-color: transparente; text-decoration: none}
a.underline: visited {background-color: transparente; text-decoration: none}
a.underline: hover {background-color: transparente; text-decoration: underline}

Este código CSS define las propiedades de visualización para todos los hipervínculos que hacen referencia a la clase "underline". La última línea define la clase de "flotar". Propiedades establecidas para esta clase determinan cómo se ve un hipervínculo cuando un cursor del ratón sobre el hipervínculo. En este ejemplo, la propiedad "text-decoration" es "underline".

4 Agregue el siguiente código CSS por debajo del código que se muestra en el paso anterior:

a.highlight: link {background-color: transparente; text-decoration: none}
a.highlight: activa {background-color: transparente; text-decoration: none}
a.highlight: visited {background-color: transparente; text-decoration: none}
a.highlight: hover {background-color: amarillo; text-decoration: none}
</ Style>

El nombre de esta clase es "punto culminante". Tenga en cuenta que el valor "background-color" la etiqueta "estacionario" es de "Amarillo". Esto hará que el color de fondo de un hipervínculo a cambiar a amarillo cuando el cursor del ratón se mueve sobre el hipervínculo.

5 Guarde el documento XHTML y abrirlo en su navegador. Mover el cursor del ratón sobre el primer hipervínculo. El navegador subrayará el hipervínculo.

6 Mueva el cursor sobre el segundo hipervínculo. El navegador se destacará el hipervínculo.

Consejos y advertencias

  • Mediante la definición de propiedades de la clase CSS "estacionario", puede crear una variedad de efectos de conversión. Incluso se puede cambiar color de la fuente y el estilo mediante la aplicación de propiedades adicionales de fuentes CSS. (Recursos)