Wildcard * in CSS für den Unterricht

Wildcard * in CSS für den Unterricht
In CSS werden zahlreiche Selektoren für verschiedene Zwecke verwendet, darunter Wildcard -Selektoren, ID -Selektoren, Klassenwählern und viele weitere. Insbesondere wählt der Wildcard -Selektor mehrere Elemente gleichzeitig aus. Es wählt Klassennamen oder Merkmale eines ähnlichen Typs aus und weist CSS -Eigenschaften zu. Wenn Benutzer diesen Wildcard -Selektor in CSS verwenden, werden alle Elemente mit demselben Klassennamen ausgewählt.

Dieser Beitrag wird die Verwendung von Wildcard * in CSS für die Klasse demonstrieren.

So nutzen Sie die Wildcard * in CSS für den Unterricht?

Probieren Sie das genannte Verfahren aus, um die Wildcard * in CSS für den Unterricht zu verwenden.

Schritt 1: Setzen Sie eine Überschrift ein
Fügen Sie zunächst eine Überschrift hinzu, indem Sie das Überschriften -Tag verwenden. Um dies zu tun, werden wir das hinzufügen "

" Schild.

Schritt 2: DIV -Container erstellen
Erstellen Sie drei separate Div -Container mit Hilfe des “Element und einfügen eine “KlasseAttribut in jedem Container mit einem bestimmten Namen entsprechend Ihren Vorlieben.

Schritt 3: Text hinzufügen
Als nächstes verwenden Sie die “

”Tag zum Einfügen von Text in Form eines Absatzes einfügen. Auch ein "fügen Sie eine" hinzu "Klasse”Attribut mit einem eindeutigen Namen. Dann einen Text in das Absatz -Tag einbetten:

LinuxHint Ltd UK



Erster Behälter
Zweiter Behälter
Dritter Behälter

LinuxHint bietet den Inhalt für verschiedene Kategorien, einschließlich Docker, HTML/CSS, Discord, PowerShell, Windows, Git Hub und vielem mehr.


Ausgang

Schritt 4: Greifen Sie auf die „STR“ -Klasse zu, indem Sie die Wildcard verwenden
Dann angeben "[Klasse*= "Str"]"Wählt alle Divelemente aus, deren Klassenname mit" beginnt "str”:

[Klasse*= "st"]
Hintergrund: RGB (80, 119, 250);
Farbe weiß;

Wenden Sie dann die folgenden CSS -Eigenschaften auf alle ausgewählten Elemente an:

  • HintergrundDie Eigenschaft legt die Farbe für den Hintergrund des Elements fest.
  • Farbe”Zugewiesen die spezifische Farbe für das Element.

Schritt 5: Stilüberschrift
Zugreifen Sie mit Hilfe des “auf die Überschrift zu"

" Schild:

H1
Farbe: RGB (44, 3, 230);
Text-Align: Mitte;

Danach das "FarbeImmobilien werden angewendet, um die Überschrift farbenfroh zu machen und die festzulegen "Textausrichtung"Eigenschaftswert als"CenterUm den Text auszurichten, um Zentrum auszurichten.

Schritt 6: Stil „Main-Div“ -Container stile Container
Greifen Sie mit dem DOT -Selektor mit dem Klassennamen auf den Haupt -Div -Container zu. “.Main-div”:

.Main-div
Ausrichtung: Zentrum;
Text-Align: Mitte;
Breite: 60%;
Rand-Links: 80px;
Grenze: 2px solide blau;

Im obigen Code -Snippet:

  • Ausrichtung"Eigenschaft legt die Ausrichtung des Elements als" fest "Center”.
  • Textausrichtung”Wird verwendet, um die Ausrichtung des Textes im Element zuzuweisen.
  • AusrichtungDie Eigenschaft legt die Ausrichtung des Elements als "Zentrum" fest.
  • links”Legt den Rand von der linken Seite des Elements fest.
  • Grenze”Definiert eine Grenze außerhalb des Elements mit einer richtigen Breite, einem richtigen Stil und einer Farbe.

Ausgang

Das ist es! Sie haben von der Wildcard * in CSS für den Unterricht erfahren.

Abschluss

Die Wildcard "*" in CSS ist ein Selektor, der für die Auswahl aller Elemente gemäß dem definierten Wert verwendet wird. Nach der Auswahl können Sie ein einzelnes Styling -Layout auf alle Elemente anwenden. Dieser Ansatz ist nützlich, wenn es erforderlich ist, mehrere Elemente mit demselben Klassenwert zu stylen. Diese Beschreibung hat die Wildcard * in CSS für die Klasse erklärt.