Cambiar diseño de "title"

[ivo5860]

Iniciado por pzin

Con CSS podrías utilizar un pseudo-elemento y la función attr() para tomar el valor de title. Algo así:

Código HTML:

<a href="#" title="arriba">Abajo</a>
 

Código CSS:

a[title]:hover {
  position: relative;
}
 
a[title]:hover:after {
  position: absolute;
  left: 50%;
  top: 100%;
  padding: 4px;
  background: grey;
  white-space: nowrap;
  z-index: 99;
  transform: translateX(-50%);
  content: attr(title);
}
 

Por ejemplo:

Gracias por la ayuda !