CSS: Icon vor Hyperlinks voranstellen

bluebird145

Ich möchte diese ja nicht ändern sondern nur mitteilen, die Standardfarbe zu verwenden.
Würde ich dort jetzt fest eine Farbe zuweisen würde ich automatisch die Einstellungsmöglichkeit im Backend aushebeln.

Ideal wäre daher den ersten Code mit dem :not zum Laufen zu bringen. Verstehe nur nicht wieso das nicht funktioniert.

Viele Grüße

Werbepost

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

helix

Soweit ich durch den Quellcode auf deiner Seite durchsteige, müsste die Klasse .nx-posts völlig ausreichen.

Irgendwie ist das Problem ein bisschen, dass du eher unstrukturiert was durchprobierst, nicht so ganz wirklich weißt, was du tust – und dich dann wunderst, wenn es nicht funktioniert.

Und auf der anderen Seite weiß ich nicht wirklich, was du jetzt in deiner CSS stehen hast.

Aalso:

Code

.entry-content :not(.nx-posts) a:before {}

Zwischen den geschweiften Klammern steht alles, was vor deinem Link kommen soll, also Genericon, seine Ausrichtung, Farbe des Genericons, ggf. etc.

Wenn du die Farbe vom Link(text) selber auch geändert haben willst, gilt analog:

Code

.entry-content :not(.nx-posts) a {}

und zwischen die geschweiften Klammern deine Farbangabe für den Linktext.

Gruß
helix

bluebird145

Hallo Helix,

genau so habe ich es getestet und aktuell eingerichtet:

Code

.entry-content :not(.nx-posts) a {
color: #dd3333;
}




.entry-content :not(.nx-posts) a:before {
content: '\f442';
font-family: 'Genericons';
color: #dd3333;
}

Alles anzeigen

Schaust du dir die Startseite an, sind aber alle Links im .nx-posts-Bereich rot eingefärbt und mit einem Icon versehen.

helix

Sorry, Fehler von mir.
Habe nochmal nachgelesen, wie die Pseudoklasse :not funktioniert. Sie erwartet einen einfachen Selektor, eine Klasse kann man damit nicht ansprechen.
http://wiki.selfhtml.org/wiki/CSS/Selek…seudoklasse/not

Also bleiben dir zwei Wege:
* eine Klasse erstellen für die Genericon-Links
* nochmal genau die Struktur der Seite bürsten, ob du mit verschachtelten CSS-Selektoren die Links, die du haben willst, sauber ansprechen kannst.

Gruß
helix

bluebird145

Hallo zusammen,

es gibt Neuigkeiten, diesmal vom Theme-Hersteller selber, allerdings funktioniert auch dieser CSS-Code nicht.
Demnach gibt es also eine separate Klasse für Links.

Zitat

[FONT=arial]
The CSS for hyperlinks will work with a custom page class (ex; assigning additional page class "nx-customlink" ).[/FONT]

Code

.nx-customlink .entry-content *:not(.nx-posts) a,
.nx-customlink .entry-content *:not(.nx-posts) a:visited {
    color: #dd3333;
}


.nx-customlink .entry-content *:not(.nx-posts) a:before {
    content: '\f442';
    font-family: 'Genericons';
    color: #dd3333;
}

Alles anzeigen

Willkommen! Melden Sie sich an oder registrieren Sie sich.

CSS: Icon vor Hyperlinks voranstellen

Jetzt mitmachen!