CSS Pseudoklassen und Pseudeoelemente

[Enotsa]

Hi ich stehe vor folgendem Problem und hoffe es kann mir jemand behilflich sein.

Ich soll Links die auf externe Seiten zeigen mit diesen < > klammern umschließen das gelingt mir auch mittels

a.linkExtern::before {
    content: '<';
}

a.linkExtern::after {
    content: '>';
}

jedoch sind diese dann Bestandteil des Links sie sollen Ihn aber halt eben nur umschließen ohne seine Eigenschaften als Link zu übernehmen.

Quasi <Link> und nicht wie es bei mir ist <Link>

Hoffe es kann mir jemand helfen

 

[habichtfreak]

mit text-decoration bekommt du den unterstrich weg, ist dann aber nur optisch das was du willst. <> ist weiterhin bestandteil des links. warum schreibst du die zeichen nicht einfach in die html datei wenn sie da sein sollen?

 

[kachiri]

a.linkExtern::before {
    content: '<';
    text-decoration: none;
}
 
a.linkExtern::after {
    content: '>';
    text-decoration: none;
}

Sollte es tun.

@Vorposter: Weil das ganze nur bei externen Links gelten soll, ohne das man beim Schreiben daran denken muss, jedes mal <> um den Link zu setzen. Das kann man zwar machen, wenn man alleine schreibt, wenn aber mehrere Leute dran arbeiten, wäre es ja grundsätzlich toll, wenn es von selbst erkannt wird, dass es ein externer Link ist und er entsprechend die Markierung setzt.

 

[Enotsa]

Tja einfach in die HTML fällt flach weil es die Aufgabenstellung halt mit CSS verlangt.
Das mit der text-decoration funktioniert leider nicht und würde an der Eigenschaft ja auch nichts ändern.

Also zusammengefasst kann man sagen es gibt keinen weg diese Klammern autark sein zu lassen? Sobald ich sie mit after und before hinzufüge sind und bleiben sie Teil des Links?

 

[sdwaroc]

Umschließ den Link mit nem <span> und weise dem die Diamond-Brackets mit ::before und ::after zu.

Keine Angst vor redundanten Elementen!

PS.: Dumme Aufgabe.

 

[Enotsa]

Yeah danke. Das hat es gebracht.

Und ja die Aufgabe ist dumm, geht aber noch schlimmer ist halt eine sehr konstruierte Aufgabe für eine Praktische Arbeit an der Hochschule.

 

[sdwaroc]

Ja, ich kenn solche Aufgaben, muss mich da selbst durchquälen. Viel besser war das Projekt von Mediendesignern an ner anderen Hochschule: Erstelle eine responsive HTML-Homepage ohne Javascript und PHP. Was der Dozent wohl nicht im Auge hatte: Frames sind in HTML5 gar nicht mehr drin. Womit man sich nicht alles rumärgern muss.

Freut mich, dass ich helfen konnte!