Info: Dieser Blog wurde 2014 eingestellt. Dies hat viele Gründe, die an dieser Stelle jedoch nicht relevant sind. Die meisten der hier veröffentlichten Tutorials sind inzwischen nicht mehr aktuell, verlasst euch also nicht auf das hier geschriebene.
Zusammen mit dem Blog sind auch unsere E-Mail, unser ask.fm und unser facebook eingestellt.

Link Hover formatieren

Heute zeige ich euch, wie ihr den Hover bei Links verändert.
Grundsätzlich könnt ihr im Vorlagendesigner nur die Farbe verändern, aber über den HTML Teil noch mehr.


Öffnet den HTML Teil eures Post und sucht mit STRG+F nach a:hover {


So müsste es aussehen. Wenn es anders aussieht habt ihr schonmal was verändert.

Jetzt kommt der spaßige Teil - jetzt dürft ihr nämlich rumspielen ♥

Ihr könnt jetzt nämlich diesen Code nach belieben verändern.
Hier ein paar Möglichkeiten.

color: #FARBE; (normalerweise steht dort $titlecolor;, was sich auf den Vorlagendesigner bezieht. Also den Punkt könnt ihr als Einziges im Vorlagendesigner verändern.)

text-decoration:underline; (ist klar, oder? Dieser Teil besagt, dass es unterstrichen ist. Ihr könnt auch text-decoration:overline; oder text-decoration:underline overline; einsetzen.)

letter-spacing: XYpx; (sehr interessanter Teil: Das bedeutet, dass die Buchstaben beim Mouseover auseinander gezogen werden. Probiert es einfach mal aus. Ich persönlich bevorzuge hier 2px, aber passt es nach eurem Belieben an)

font-size: XYpx ODER XY% (Die Größe beim Rüberfahren kann variiert werden)

So, ich hoffe ihr habt es verstanden... Wenn nicht, dann schreibt es mir in die Kommentare und ich versuche es zu verbessern =)


Kommentare:

  1. Was zum Teufel ist mit Link Hover gemeint? O.o

    AntwortenLöschen
  2. @ Anonym: Das heißt was mit einem Link passiert wenn du mit der Maus darüber fährst. Das er z.B. die Farbe wechselt oder unterstrichen wird oder so.

    AntwortenLöschen
  3. das habe ich schon lange gesucht, danke! :)

    AntwortenLöschen
  4. Man könnte das doch auch einfach im CSS-Fenster im Vorlagendesigner machen? Wäre das nicht einfacher?

    AntwortenLöschen
  5. Lyn, ah, okay, dankeschön! :)

    AntwortenLöschen
  6. Und wie mach ich das, sodass NUR die Posttitel diesen Hover-Effekt haben?

    AntwortenLöschen
  7. cool, danke :D

    und was muss ich für einen Code verwenden, damit die Schrift beim Hover kursiv wird?

    AntwortenLöschen

Wie schon an anderer Stelle dieser Seite bemerkt, ist der Blog eingestellt. Das bedeutet leider auch, dass wir als Blogautoren auf deinen Kommentar nicht eingehen werden.