Hauptinhalt
Programmierung
Kurs: Programmierung > Lerneinheit 2
Lektion 2: Einführung in CSS- CSS-Grundlagen
- Tipp: Nach Tag-Namen selektieren
- Challenge: Das farbenfrohe Viech
- CSS: Per ID auswählen
- Challenge: Die Jahreszeiten- IDs
- CSS: Per Klasse auswählen
- Challenge: Äpfel- und Bananenklassen
- Einfache CSS-Selektoren verwenden
- Projekt: Reise-Website
© 2023 Khan AcademyNutzungsbedingungenDatenschutzerklärungCookie-Meldung
Tipp: Nach Tag-Namen selektieren
Wie du soeben gelernt hast, benutzen wir CSS-Regeln, um Elemente auf einer Webseite zu selektieren, damit wir diese formatieren können.
Wir sagen unserer CSS-Regel mit Hilfe von Selektoren, welche HTML-Elemente sie formatieren soll. Es gibt viele Arten von Selektoren, welche wir später alle behandeln werden, aber hier wollen wir nur die anschauen, welche wir im Talk-through gezeigt haben: den Element-Selektor.
Der Element-Selektor selektiert HTML-Elemente anhand ihrer Tag-Namen. Jedes HTML-Element —
<h1>, <p>, <li>, <body> — und jedes beliebige andere HTML-Element kann mit CSS selektiert werden, indem der Tag-Name ohne die spitzen Klammern (< und >) benutzt wird. So kannst du beispielsweise alle <p>-Tags in deiner Webseite mithilfe des Element-Selektors p selektieren. Hier ist eine CSS-Regel, welche die Farbe der einzelnen Absätze auf einer Webseite ändert:p {
color: rgb(255, 0, 0);
}Prüfen wir, ob dies Sinn macht. Welche dieser Regeln würde alle Elemente
<h2> auf der Seite selektieren?In der nächsten Challenge wirst du Element-Selektoren mit anderen Tag-Namen ausprobieren. Beachte während des Experimentierens, was deine CSS-Regeln auf deiner Seite bewirken. Zum Beispiel, welche Elemente ihre Farbe ändern und welche nicht.
Willst du an der Diskussion teilnehmen?
warum bekommt man hier keine Punkte(2 Bewertungen)
Ist an sich ja nur reine Wdh. bzw. in Textform vom vorigem Video.(3 Bewertungen)
Worin besteht der Unterschied zwischen id- und class-Selektoren?(1 Bewertung)