CSS Beispiel

CSS-Hintergrund

Ein fixiertes Hintergrundbild (dieses Bild scrollt nicht mit dem Rest der Seite)

Erklärung der Hintergrundeigenschaften

CSS-Text

 

Erläuterung der Text-Eigenschaften

CSS-Schriftarten

 

Erläuterung der Schrift-Eigenschaften

CSS-Links

Verschiedene Farben für besuchte/nicht besuchte Links hinzufügen

 

Erläuterung der Link-Eigenschaften

CSS-Listen

Ein Bild als Listenpunkt-Markierung mithilfe einer browserübergreifenden Lösung festlegen

CSS - Standardstile von Listenelement li entfernen

 

Erklärung der Listen-Eigenschaften

CSS-Tabellen

th- und td-Elemente einer Tabelle mit einem schwarzen Rahmen angeben

Die horizontale Ausrichtung des Inhalts festlegen (text-align)

Legen Sie die vertikale Ausrichtung des Inhalts fest (vertical-align)

 

Erklärung der Tabelleneigenschaften

CSS-Box-Modell

Legen Sie die Gesamtbreite eines Elements mithilfe einer browserübergreifenden Lösung auf 250 Pixel fest

 

Erklärung des Box-Modells

CSS-Rahmen

 

 

 

 

 

Erklärung der Border-Eigenschaften

CSS Outline

 

Erklärung der Outline-Eigenschaften

CSS Margin

Legen Sie den oberen Außenabstand von Text in Zentimetern fest

Legen Sie den unteren Außenabstand von Text mit einem Prozentwert fest

Legen Sie den linken Außenabstand von Text mit einem Zentimeterwert fest

 

Erklärung der Margin-Eigenschaft

CSS-Padding

 

Erklärung der Padding-Eigenschaft

CSS-Gruppierung und Verschachtelung

 

Erklärung von Gruppierung und Verschachtelung

CSS-Abmessungen

Pixelwerte verwenden, um die Breite eines Elements festzulegen

Legen Sie die Breite eines Elements mit einer Prozentangabe fest

Legen Sie die maximale Breite eines Elements mit einem Pixelwert fest

Die maximale Breite eines Elements mithilfe eines Prozentwerts festlegen

Verwenden Sie Pixelwerte, um die Mindestbreite eines Elements festzulegen

Verwenden Sie Prozentangaben, um die Mindestbreite eines Elements festzulegen

 

Erklärung der Größeneigenschaften

CSS-Display

 

Erklärung der Display-Eigenschaft

CSS-Positionierung

Wie man Scrollbalken verwendet, um Inhalte anzuzeigen, die innerhalb eines Elements überlaufen

Wie man die automatische Überlaufbehandlung im Browser einstellt

Pixelwerte verwenden, um die obere Position eines Bildes festzulegen

Pixelwerte verwenden, um die untere Position eines Bildes festzulegen

Pixelwerte verwenden, um die linke Position eines Bildes festzulegen

Pixelwerte verwenden, um die rechte Position eines Bildes festzulegen

 

Erläuterung der Positionierungseigenschaften

CSS Float

Einem Bild einen Rahmen und Außenabstand hinzufügen und es links neben einen Absatz floaten lassen

 

Erklärung der Float-Eigenschaft

Elemente mit CSS ausrichten

Eine browserübergreifende Lösung verwenden, um die Ausrichtung der linken/rechten Position festzulegen

Eine browserübergreifende Lösung verwenden, um die Ausrichtung der linken/rechten Position mit Float festzulegen

 

Erklärung der Ausrichtungsattribute

Mit CSS generierter Inhalt

Fügen Sie die URL mit dem content-Attribut in die Klammern nach jedem Link ein.

Die Nummerierung von Abschnitten und Unterabschnitten lautet 'Abschnitt 1', '1.1', '1.2' usw.

CSS-Pseudoklassen

:first-child - trifft auf das erste i-Element innerhalb eines p-Elements zu

:first-child - trifft auf alle i-Elemente im ersten p-Element zu

 

Erklärung der Pseudoklassen

CSS-Pseudoelemente

Den ersten Buchstaben der ersten Textzeile besonders gestalten

 

Erklärung von Pseudo-Elementen

CSS-Navigationsleiste

 

Erklärung von Navigationsleisten

CSS-Bildergalerie

 

Erklärung der Bildergalerie

CSS-Bildtransparenz

 

Erklärung der Bildtransparenz

CSS-Bild-Sprites

 

Erklärung der Bild-Sprites

CSS-Attributselektoren

Elemente mit einem title-Attribut auswählen, das einem bestimmten Wert entspricht

Wählen Sie Elemente mit einem title-Attribut aus, das einen bestimmten Wert enthält (wobei (~) Attribut und Wert trennt)

Wählen Sie Elemente mit einem title-Attribut aus, das mit einem bestimmten Wert beginnt (wobei (|) Attribut und Wert trennt)

 

Erklärung zu Attributselektoren

CSS-Anwendungsbeispiele

Weitere Beispiele:https://www.jyshare.com/examples/

Weitere Erweiterungen