Dugh Dugh: <a> per CSS mit bestimmten Eigenschaften versehen

Guten Abend zusammen!

Ich möchte gerne jedem anchor <a class="more" href…> in einem HTML-Dokument [eigene Kenntniseinschätzung: ganz gut] per externer CSS-Datei bestimmte Eigenschaften zuweisen. Nach meiner bisherigen Ahnung von CSS [in aller Regel erfolgreich] hatte ich gehofft, dass das in etwa so aussehen könnte:

a.more
{
	target:_blank;
	title: "Öffnet einen neuen Tab";
}

Meine intensive Suche im Internet hat leider ergeben, dass es diese Eigenschaften so in CSS nicht gibt und ich konnte leider auch keinen geeigneten Workaround finden.

Die Seite, in der diese Links platziert werden sollen, wird mehr oder weniger täglich um neue Abschnitte mit weiteren Links ergänzt und ich möchte mir einfach das immer wiederkehrende Eintippen der Eigenschaften ersparen. Gibt es hier vielleicht eine elegante z.B. JavaScript-Lösung? [froh, wenn ich den Code nachvollziehen kann]

Herzlich dankbar für jeden Tipp!

Dugh Dugh

  1. Hallo Dugh,

    ich möchte mir einfach das immer wiederkehrende Eintippen der Eigenschaften ersparen.

    das machst du aber sowieso schon

    <a class="more"

    da wäre jetzt ein target="_blank" kein großer Extraaufwand zu class="more"

    Aber es geht natürlich auch komplett anders, wo du sowohl auf class als auch auf target verzichten kannst. Wie man da bei dir am besten vorgeht, hängt natürlich vom Quelltext an. Kannst du mehr zeigen?

    Gruss
    Henry

    --
    Meine Meinung zu DSGVO & Co:
    „Principiis obsta. Sero medicina parata, cum mala per longas convaluere moras.“
    1. Servus Henry,

      a.more
      {
      	color: darkblue;
      	text-decoration: none;
      	font-style:italic;
      }
      a.more:hover
      {
      	color: blue;
      }
      

      wird aufgerufen mit <a class="more" ...

      Grüße DD

      1. @@Dugh Dugh

        Was sind das für Links? Stehen sie in einem Menü und sind damit als Links erkennbar?

        Oder stehen die Links im Fließtext? Dann ist a.more { color: darkblue; text-decoration: none } verkehrt; Farbe allein reicht nicht, damit Links als solche erkennbar sind. Etliche Menschen können keine Farben erkennen. Links im Fließtext müssen unterstrichen sein.

        LLAP 🖖

        --
        „Man kann sich halt nicht sicher sein“, sagt der Mann auf der Straße, „dass in einer Gruppe Flüchtlinge nicht auch Arschlöcher sind.“
        „Stimmt wohl“, sagt das Känguru, „aber immerhin kann man sich sicher sein, dass in einer Gruppe Rassisten nur Arschlöcher sind.“

        —Marc-Uwe Kling
  2. @@Dugh Dugh

    a.more
    {
    	target:_blank;
    	title: "Öffnet einen neuen Tab";
    }
    

    Das erste S in CSS steht für Style. Wenn es darum ginge, Elementen beliebige Attribute hinzuzufügen, hieße es CAS.

    ich möchte mir einfach das immer wiederkehrende Eintippen der Eigenschaften ersparen.

    Vielleicht möchtest du den Nutzern das Öffnen der Links in neuern Tabs ersparen? Ob ein Nutzer einen Link im neuen Tabs öffnen möchte, kann sie selbst entscheiden und das ggfs. tun. Ansonsten: was Jakob Nielsen sagt: “Opening up new browser windows is like a vacuum cleaner sales person who starts a visit by emptying an ash tray on the customer's carpet. Don't pollute my screen with any more windows, thanks.”

    Und sicher möchtest du den Nutzern nervige Tootips ersparen.

    Gibt es hier vielleicht eine elegante z.B. JavaScript-Lösung?

    Mit document.querySelectorAll('.more') erhältst du eine Collection der betreffenden Links, durch die du iterieren und den Elementen mit setAttribute] Attribute verpassen kannst.

    LLAP 🖖

    --
    „Man kann sich halt nicht sicher sein“, sagt der Mann auf der Straße, „dass in einer Gruppe Flüchtlinge nicht auch Arschlöcher sind.“
    „Stimmt wohl“, sagt das Känguru, „aber immerhin kann man sich sicher sein, dass in einer Gruppe Rassisten nur Arschlöcher sind.“

    —Marc-Uwe Kling
    1. @LLAP

      Hallo, erst mal herzlichen Dank für den document... Tipp, den ich mir sehr genau anschauen werde. Je weniger wiederholtes Getippe, desto besser.

      Der Hinweis auf CSS statt CAS klingt im ersten Moment überzeugend. Wie asst das dann mit CSS-Eigenschaften wie floating, animation, usw.?

      Deine Meinung zum Thema "jeweils neuer Tab" betrifft, lass mich nur soweit kommentieren. Ich halte es für eine Unart in Foren, aus der eigenen Arbeits-, Angebots- und Besucher-Umgebung anderen mehr oder weniger Vorschriften mit "allgemeinen Regeln" zu machen, ohne die im problematischen Bereich gegebene überhaupt zu kennen.

      In meinem Projekt werden mit den Links Texte aufgerufen, die von der Länge her jeden Rahmen eines iFrames sprengen und durch den Aufruf im selben Tab den Zugriff auf die vorherige Übersicht, die auch zum Vergeich verschiedener Texte einlädt, unmöglich macht.

      Schöne Grüße DD