Archivos

Como crear tooltips en WordPress mediante CSS

Tooltip Aplicar tooltips es relativamente sencillo en CSS, basta una simples líneas de código y conocer el modo de aplicarlo, para tener los tooltips en funcionamiento.

Se suele utilizar para mostrar información extra y personalizada al usuario de una página, no es nada intrusivo y aparece y desaparece en función del usuario, es decir, los tooltips son un tipo de notificaciones que se muestran al usuario cuando este pasa el cursor sobre una imagen, enlace externo, etc…, también se les conoce como “globos de ayuda”.

Loading...

Para llevar a cabo esto, debemos incluir en nuestro fichoro de estilos “style.css” o el que tengas para el tema que tienes en tu blog, el siguiente código:

a:hover {background:#ffffff; text-decoration:none;}
a.tooltip span {display:none; padding:2px 3px; margin-left:8px; width:130px;}

a.tooltip:hover span{display:inline; position:absolute; background:#ffffff; border:1px solid #cccccc; color:#6c6c6c;}

El modo de empleo sería el siguiente:

<a class="tooltip" href="#">Texto del enlace<span>Escribe aquí el texto del tooltip</span></a>.

 

Acceso

¿Olvidaste la contraseña?

¿No tienes cuenta? Registro

¿Olvidaste la contraseña?

Introduce los datos de tu cuenta y te enviaremos un enlace para restablecer la contraseña.

El link para restablecer tu contraseña parece inválido o caducado.

Acceder

Privacy Policy

Añadir a Colección

No tienes Colecciones

Aquí encontrarás todas las colecciones que has creado con anterioridad.

GDPR Cookie Consent with Real Cookie Banner