Nicky Meuleman, inspiriert von Cassie Evans, beschreibt, wie sie den Hover-Effekt für Ankerlinks auf ihren Websites erstellt haben. Wenn ein Link überfahren wird, gleitet ein andersfarbiger Unterstrich mit einer Lücke dazwischen herein. Typisches text-decoration hilft hier nicht weiter, ...
…Nehmen wir an, Sie bauen eine Website und arbeiten mit einem Designer zusammen. Sie kommen mit soliden Designs zu Ihnen und Sie sind bereit. Sie sind auch ein gewissenhafter Front-End-Entwickler und möchten gerne
Es ist ein cooler kleiner Effekt. Der Standard-Link-Stil hat eine Unterstreichung (was eine gute Idee ist) und dann auf :hover sieht man, wie die Unterstreichung im Wesentlichen dicker wird und fast das wird, was sie gewesen wäre, wenn Sie ...
Bevor wir dazu kommen, *wie* man Unterstreichungen stylt, sollten wir die Frage beantworten: *sollten wir unterstreichen*?
Im Grafikdesign werden Unterstreichungen generell als unsophisticated angesehen. Es gibt schönere Wege, um Betonung hervorzuheben, Hierarchien zu etablieren und Titel abzugrenzen. …
Das Gestalten der Unterstreichungen, die unter Links sitzen, kann eine knifflige Angelegenheit sein, und ich vergesse ständig, welcher Ansatz je nach Situation der beste ist. Glücklicherweise bringt uns John Jameson in diesem Gastbeitrag auf den neuesten Stand. ...
Sie kennen vielleicht den klassischen Link-Stil sehr gut. Blau mit einer Unterstreichung. Es gibt eine alternative Methode, um denselben Effekt zu erzielen, der etwas schöner ist.
Hier ist der Code
a {
text-decoration: none;
background: url(link-line.gif) repeat-x 0 