So verwenden Sie CSS-Front-End-Fragen und Antworten-php.cn

CSS (Cascading Style Sheets) ist eine Sprache zum Definieren von Webseitenstilen. Sie wird zusammen mit HTML zum Erstellen von Webseiten verwendet. CSS steuert das Erscheinungsbild und die Position von HTML-Elementen, um Webseiten zu verschönern und die Benutzererfahrung zu verbessern.

In diesem Artikel stellen wir die Grundlagen von CSS vor und zeigen Ihnen, wie Sie mit CSS den Stil von HTML-Elementen ändern.

CSS-Grundlagen

CSS besteht aus Selektoren und Deklarationen. Mit Selektoren werden HTML-Elemente ausgewählt, auf die Stile angewendet werden sollen, während Deklarationen die Stile angeben, die auf die ausgewählten Elemente angewendet werden sollen.

Selektor

Hier sind einige gängige Selektoren:

Elementselektor# 🎜🎜#: Wählen Sie ein Element aus, indem Sie den HTML-Elementnamen angeben, zum Beispiel:
```
p {
color: red;
}
```
Nach dem Login kopieren
Dadurch werden alle
-Elemente im Dokument ausgewählt und ihre Farbe auf Rot gesetzt.
Klassenselektor : Wählen Sie Elemente aus, indem Sie den Klassennamen angeben, zum Beispiel:
```
.my-class {
background-color: yellow;
}
```
Nach dem Login kopieren
Dies wird ausgewählt Alle Elemente mit class="my-class" und setzen ihre Hintergrundfarbe auf Gelb.
ID-Auswahl : Wählen Sie ein einzelnes Element aus, indem Sie die ID angeben, zum Beispiel:
```
#my-id {
font-size: 20px;
}
```
Nach dem Login kopieren
Das wird Wählen Sie Element mit der ID="my-id" aus und stellen Sie die Schriftgröße auf 20 Pixel ein.
Attributauswahl : Wählen Sie Elemente aus, indem Sie ihre Attribute angeben, zum Beispiel:
```
a[href="https://www.google.com"] {
color: blue;
}
```
Nach dem Login kopieren
Dadurch werden alle ausgewählt
Elemente, die auf Google-Websites verweisen, und ihre Farbe auf Blau setzen.
Pseudoklassen und Pseudoelemente : Wählen Sie Elemente aus, indem Sie ihren Status oder ihre Position angeben, zum Beispiel:
```
a:hover {
text-decoration: underline;
}
```
Nach dem Login kopieren
#🎜🎜 #Dadurch werden alle
Elemente ausgewählt und deren Text beim Mouseover unterstrichen.

Deklarationen

Deklarationen sind Teil von CSS-Regeln und jede Deklaration besteht aus Attributen und Werten. Das Attribut gibt den anzuwendenden Stil an und der Wert bestimmt den spezifischen Wert des Attributs. Zum Beispiel:

p {
  color: red;
}

Nach dem Login kopieren

In dieser Regel ist „Farbe“ das Attribut und „Rot“ der Wert. Dadurch werden alle

-Elemente im Dokument ausgewählt und ihre Farbe auf Rot gesetzt.

So wenden Sie CSS an

CSS kann auf drei Arten auf HTML-Dokumente angewendet werden: interne Stylesheets, externe Stylesheets und Inline-Stile. Wir werden jede dieser drei Methoden separat betrachten.

Internes Stylesheet