Einen Tooltip für eine Website ist ein Weg für Web-Entwickler , um zusätzliche Informationen zu einer Webseite , wie Informationen , wo Sie einen Link oder Informationen ein Textfeld erfordert nehmen hinzufügen. Tooltips sind eine Möglichkeit des Ausscheidens eine Notiz an den Benutzer , wenn sie mit der Maus über ein Bild oder Text . Durchdacht Tooltips sind subtil und helfen, die Erfahrung des Benutzers zu verbessern. Tooltips sind einfach direkt in den HTML-Code durch CSS . Anleitung
1
Fügen Sie den CSS-Code in den Header-Bereich und unter dem Titel-Tag der HTML-Datei .
2
< style type = "text /css" > Spitze {border -bottom: 0px dotted # 000000 ; color: # 000000 ; Umriss : none; cursor: pointer ; text-decoration : none; position: relative ;} . . Spitze span { margin-left : - 999em ; position: absolute; } . Tipp: hover span { border-radius : 15px 15px ; box-shadow : 13px 13px 13px rgba (0, 0, 0, 0,1 ); font-family : Georgia, " ; Times New Roman " , Times , serif ; position: absolute; left: 1em ; top: 2em ; z -index: 99; margin-left : 0; Breite : . 250px ;} üblich {padding : 0.8em 1em ;} . üblich { background: # FFFFFF ; border: 1px solid # FFAD33 ;}
3
Fügen Sie den folgenden HTML-Code unter < /head> für eine Probe der Tooltip.
4
Beispiele für CSS Tooltips !
Beispiele einer Tooltip Tooltips verwendet werden, um sorgfältig durchdacht Informationen hinzufügen, um die Erfahrung des Benutzers zu verbessern.
5
Um den Tooltip anzuzeigen, öffnen Sie die HTML-Datei in einem Web-Browser und halten Sie die Maus über den unterstrichenen tooltip Wort .
6
Stellen Sie den Code nach Bedarf , zum Beispiel den Text ändern, Dekoration unterstreichen oder die Hintergrundfarbe # FFFFAA für einen gelben .
