Lina: Verweise gestalten

SELF-Forum

Verweise gestalten

Lina
– Informationen zu den Bewertungsregeln

Hallo, bin auf der Suche nach Hilfe bei einer Website-Erstellung auf Selfhtml gestoßen und hab schon viele gute Dinge gelernt. Aber eins klappt einfach nicht:

Ich möchte gern einen Verweis, den ich in der Html-Datei eingebaut habe, mit CSS gestalten. Jetzt habe ich aber das Problem, dass ich den Verweis ja mit <a href= usw. benennen muss, damit er als Link funktioniert, richtig? Jetzt habe ich im CSS definiert, dass alle a:link weiß und Fett sind, wie meine Menüpunkte, die ja auch Verweise sind. Wie bekomme ich es hin, dass Verweise im Text in einer anderen Darstellung auftauchen? Z. B. Blau und unterstrichen.

Ich habe dies:

a: link {color: #ffffff; font-weight:bold; font-size: large; text-decoration: none;} a: active {color: #ffffff; font-weight: bold;} a: visited {color: #ffffff; font-weight: bold;} a: hover {color: #ffffff; font-weight: bold;}

Was muss ich tun bzw. was mache ich falsch?

Danke schonmal!

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Verweise gestalten

    MrMurphy
    – Informationen zu den Bewertungsregeln

    Hallo,

    du solltest die Menüpunkte und die Texte in verschiedene Container schreiben. Bei HTML5 empfiehlt sich für die Menüpunkte (also wahrscheinlich die Haupt-Navigation) das nav-Element und für alle Texte das main-Element. Für die unterschiedlichen CSS-Angaben schreibst du die beiden Elementnamen dann mit einem Leerschritt vor die jeweiligen Format-Angaben.

    Gruss

    MrMurphy

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Verweise gestalten

      Lina
      – Informationen zu den Bewertungsregeln

      Okay, das klingt logisch und hilft meinen Gedanken auch generell weiter. Aber es funktioniert nicht :(

      Jetzt habe ich das:

      inhalt a:link {color: #0000ff; font-weight:bold; font-size: normal; text-decoration: underline;} navigation a:link {color: #ffffff; font-weight:bold; font-size: large; text-decoration: none;} navigation a:active {color: #ffffff; font-weight: bold;} navigation a:visited {color: #ffffff; font-weight: bold;} navigation a:hover {color: #ffffff; font-weight: bold;}

      Der Verweis verlinkt einen anderen Menüpunkt in meinem Text. Kann das damit zusammenhängen? Oder was stimmt nicht?

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. Verweise gestalten

        MrMurphy
        – Informationen zu den Bewertungsregeln

        Hallo,

        inhalt und navigation sind keine HTML5-Container. Dazu solltest du schon wie von mir geschrieben nav und main benutzen.

        DIV-Container mit Klassen oder IDs, auf die du wohl raus willst, sind veraltet und sollten nur noch bei  Bedarf verwendet werden.

        Gruss

        MrMurphy

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

        1. Verweise gestalten

          Lina
          – Informationen zu den Bewertungsregeln

          Juhu, es funktioniert!!! Viiiielen Dank!

          Beitrag melden
          –
          Informationen zu den Bewertungsregeln

      2. Verweise gestalten

        Gunnar Bittersmann Homepage des Autors
        – Informationen zu den Bewertungsregeln

        @@Lina:

        inhalt a:link {color: #0000ff; font-weight:bold; font-size: normal; text-decoration: underline;} navigation a:link {color: #ffffff; font-weight:bold; font-size: large; text-decoration: none;} navigation a:active {color: #ffffff; font-weight: bold;} navigation a:visited {color: #ffffff; font-weight: bold;} navigation a:hover {color: #ffffff; font-weight: bold;}

        was stimmt nicht?

        1. Du denkt, :link stünde für alle Links. Der Gedanke liegt nahe, stimmt aber nicht.

        2. Du machst Angaben wiederholt, obwohl sich gar nichts ändert. DRY! (Don’t repeat yourself!)

        3. Du hast den :focus verloren.

        Obiger Code sollte eher so aussehen:

        inhalt a {color: #0000ff; font-weight:bold; font-size: normal; text-decoration: underline;}
navigation a {color: #ffffff; font-weight:bold; font-size: large; text-decoration: none;}

        Natürlich aber nicht mit inhalt/navigation, siehe MrMurphy.

        LLAP

        --
        „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
        Beitrag melden
        –
        Informationen zu den Bewertungsregeln