Matthias Apsel: #header h1, #header p

Beitrag lesen

SELF-Forum

#header h1, #header p

Matthias Apsel Homepage des Autors
– Informationen zu den Bewertungsregeln

Om nah hoo pez nyeetz, bari!

Kannst du die Versuche auch Verlinken? Zum Anschauen wäre das super, weil ich zwar den Code kopieren kann, aber die Bilder ja nicht habe.

Wir reden jetzt nur über den Bereich von ganz oben bis zum roten Streifen und verwenden html5:

also
 <!doctype html>

Dies ist doch sicherlich deine Überschrift, die auf jeder Seite gleich sein soll. Dein Erkennungszeichen, Markenname, Logo ... - header ist das passende Element. Dieser Header enthält eine Überschrift und einen ehemals-Lauftext.

<header>  
  <h1>Swiss-Travel-Hans</h1>  
  <p>Lauftext</p>  
</header>

Um die entsprechenden Elemente zu selektieren (Lesestoff - wichtig!, vor allem "einfache Selektoren" und "Kombinatoren") verwendest du
den Selektor "header h1" (ohne Anführungszeichen). Damit werden alle Überschriften erster Ordnung (du hast nur eine) selektiert, die sich innerhalb von header-Elementen befinden, ausgewählt, selektiert, angesprochen. Für deinen Lauftext verwendest du den Selektor "header p".

Die Überschrift bekommt die beiden Bilder, also:

header h1 {
  background-image: url(Hans_Bilder/Schweizerfahne-Rheinfall_180x100.jpg), url(Hans_Bilder/Luzern-Kapellbruecke_180x100.jpg);
  background-position: left top, right top;
  background-repeat: none;
}

in verlinkter Email habe ich nicht verstanden: Selektiere per #header h1...", #header ist eine id, aber was ist h1, eine class (.h1) oder #header, h1 ?

Das sollte nach obigem Posting und Lektüre des verlinkten Artikels klar werden (Schnellzugriff: http://wiki.selfhtml.org/wiki/CSS/Selektoren/Kombinator/Nachfahrenselektor).

Matthias

--
1/z ist kein Blatt Papier.

Beitrag melden
–
Informationen zu den Bewertungsregeln