super simple css tooltips

Dicas de ferramentas CSS super simples

Adicione facilmente uma dica de ferramenta pairar a um elemento. A dica de ferramenta pode ser colocada à esquerda, direita ou inferior de um elemento. Uma segunda opção inferior inclui um ponteiro.

Classes CSS

• tooltip--left
• tooltip--right
• tooltip--bottom
• tooltip--triangle

Uso

O CSS leva qualquer elemento que tenha uma classe tooltip--* e usa o atributo data-tooltip no elemento para fornecer o texto da dica de ferramenta.

[ class ^= "tooltip" ] {
  ...
  content : attr ( data-tooltip );
  ...
}

 < img href =" /img/info.svg " class =" tooltip--left " data-tooltip =" This is the text displayed " >

Apoiar

Versões atuais de Chrome, Firefox, Safari, Edge e IE10+.