Twenty seventeen - Hoverfarbe ändern und den Unterstrich gleichzeitig beseitigen

    Hallo Miteinander,

    ein weiterer völliger Neuling in Sachen Wordpress hat einen ganzen Sack voller Fragen auf dem Herzen und hofft hier auf den richtigen Tip. - Natürlich habe ich schon mehrmals die Suchfunktion im Forum verwendet, und um die Treffer, die ich da erzielt habe, zu customisieren, fehlt mir einfach die Routine und der Mut und das KnowHow sowieso. - Also, der Firefox-Inspektor wird permanent von mir bemüht, doch ich blicke kaum noch durch, wieso ist da soviel durchgestrichen und wenn man etwas anclickt, wo hover draufsteht, passiert gar nichts. Die Sachen sind alle derart miteinander verwoben.....

    Gut, um zur Sache zu kommen: Die 2017-Site an der ich aktuell arbeite, befindet sich auf einem lokalen Host, deswegen kann ich hier nichts verlinken. - Aber die routinierten Leute hier, werden das Problem sicherlich mit einem Fingerschnipp lösen können (ich hoffe, ich kann es dann auch umsetzen) -

    Ich wünsche mir für die Links sämtlicher Seiten und Beiträge, dass die Schriftfarbe von Schwarz beim Drüberfahren mit der Maus zu #FEA66C wechselt, und gleichzeitig mag der Unterstrich verschwinden.

    Ist das eine einfach zu bewerkstelligende Sache ? - Ich komme da jedenfalls nicht weiter; schon alleine das ansprechen des Hovers will nicht glücken.

    Ich würde mich sehr über sachdienliche Hinweise aus dem Forum in dieser Frage freuen, und bitte schon vielmals um Verzeihung, falls ich Fragen stelle, die Euch blöd vorkommen.

    Viele Grüsse einstweilen von Benjamin

    • Gerade eben
    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

    Versuche folgendes:

    HTML
    a:hover {
  color: #fea66c;
  text-decoration: none;
}


    Und das bitte in das 'zusätzliche CSS' (vom Dashboard -> Design -> Customizer -> zusätzliches CSS)
    evtl., wenn es so noch nicht wirkt, noch !important hinzufügen.

    Hallo Sailor56,

    hab vielen Dank, das mit der Farbe hat super geklappt. Prima ! Es sieht so einfach aus, der Code, den Du gepostet hast.
    Nur leider ist der Unterstrich noch da; trotz !important. -

    Und wenn ich nun Ausnahmen erstellen möchte, also Links, die von dieser Regelung mit der Farbe ausgenommen sind; wäre das eine Operation, die ich hinbekommen kann ? irgendwas mit class= oder so ?

    Ja irgendwas mit class. Dazu bräuchten wir einen Link und den Hinweis welche Link betroffen sein sollen.

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

    Hallo SirEctor,

    die Seite befindet sich auf einem lokalen host; ich glaube, da kann man keinen Link setzen. - Und ich muss nun gucken, bei welchen Links mir die Lachsfarbe gefällt, und wo nicht. Die Veränderung ist schon sehr stark und auch gewöhnungsbedürftig.

    Sagen wir mal so: Die Links auf den Seiten kommen gut in der Lachsfarbe. - Und die Links inform von Beitragstiteln brauchen nicht lachsfarben sein.

    Aber dieser Unterstrich, der sollte beim Hovern verschwinden, der bleibt ja schwarz und verträgt sich nicht mit dem zarten Orange.

    Bist du sicher, dass du das

    HTML
    a:hover {
  text-decoration: none !important;
}


    an die richtige Stelle (ganz ans Ende des zusätzlichen CSS) eingefügt hast.
    Ich wüsste dann keinen Grund, warum das dann nicht funktionieren sollte! .. es sei denn es hat da noch ein anders Element diesen hover-Efekt. Aber ohne den Code zu sehen, ist das unmöglich zu sagen.

    Du schreibst, die Textfarbe kannst du ändern... der Unterstrich bleibt und er ist auch nicht in der Schriftfarbe des Textes (bleibt schwarz).
    Dann würde ich vermuten, dass der Unterstrich nicht zum <a>...</a> gehört, sondern von einem Elternelement erzeugt wird.
    Stecken deine Links eventuell in einem <li><a>...</a></li> und dieses li hat einen hover-Efekt mit dem Unterstrich... oder schaltet die border-bottom dazu?
    Mal einen Rechtsklick auf einen der betroffenen Links machen und dann 'Element untersuchen' (oder sinngemäß, je nach Browser) auswählen. Dann sollte sich der Inspector öffnen und du kannst (versuchen) herauszubekommen, wo dieser Unterstrich herkommt.

    Der Unterstrich ist vermutlich der box-shadow. Versuch mal

    CSS
    a {
    box-shadow: 0 0 0 !important;
}

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

    Man sieht: es ist box-shadow. Lies dazu meinen Post #9

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

    Helau ! - box-shadow 0 0 0 !important; funktioniert ! - Super ! - Jetzt sieht das Ganze schon viel schlanker aus. Für mich immer noch gewöhnungsbedürftig; nachdem ich seit Wochen auf den schwarzen Unterstrich starre. Aber das ist es nun.

    Herzlichen Dank für die Hilfe !

    Nur mal interessehalber: Das !important bedeutet doch wahrscheinlich, dass hier etwas überschrieben wird, oder irgendwie ausgeknockt. - Ist das strapazierbar, also immer wieder zu machen, oder gibt es da Grenzen ?

    Viele Grüsse von Benjamin

    Eigentlich gilt immer die letzte Anweisung zu einem Element in der CSS-Datei. Ausnahmen gibt es. Eine davon ist !important.
    https://wiki.selfhtml.org/wiki/CSS/Tutor…de#.21important

    Wenn du jetzt mehrfach die gleiche Class mit !important kennzeichnest, gilt wieder die letzte Anweisung. Das wäre also sinnfrei.

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden