Heim >Web-Frontend >CSS-Tutorial >Was sind CSS-Stilregeln?
CSS-Stilregeln definieren den visuellen Stil von HTML-Elementen, einschließlich Selektoren (bestimmen anwendbare Elemente) und Deklarationsblöcken (definieren Stilattribute und -werte). Zu den Selektoren gehören Elementselektoren (Elementnamen angeben), Klassenselektoren (Klassennamen angeben), ID-Selektoren (IDs angeben) und Nachkommenselektoren (untergeordnete Elemente auswählen). Der Deklarationsblock enthält Stilattribute und deren Werte, mit denen das Erscheinungsbild des Elements geändert wird, z. B. Textfarbe, Schriftgröße und Hintergrundfarbe.
CSS-Stilregeln
CSS-Stilregeln werden verwendet, um den visuellen Stil von HTML-Elementen zu definieren. Jede Regel besteht aus zwei Hauptteilen:
Selektoren
Selektoren können Zielelemente auf verschiedene Arten angeben:
p
oder div . <code>p
或 div
。
.my-class
。#my-id
。div p
。声明块
声明块包含一组样式属性,每个属性都后跟一个冒号和一个值:
color
、font-size
或 background-color
。red
、12px
或 #ffffff
。示例 CSS 样式规则
<code class="css">p { color: blue; font-size: 16px; } .my-class { background-color: yellow; padding: 10px; }</code>
第一个规则适用于所有段落 (p
) 元素,将它们的文本颜色设置为蓝色,字体大小设置为 16 像素。第二个规则适用于所有具有 my-class
.my-class
. 🎜🎜🎜ID-Selektor: 🎜Wählen Sie Elemente mit einer bestimmten ID aus, z. B. #my-id
. 🎜🎜🎜Descendant-Selektor: 🎜Wählt die untergeordneten Elemente eines Elements aus, z. B. div p
. 🎜🎜🎜🎜Deklarationsblock 🎜🎜🎜Ein Deklarationsblock enthält eine Reihe von Stileigenschaften, denen jeweils ein Doppelpunkt und ein Wert folgen: 🎜🎜🎜🎜Eigenschaften: 🎜Die festzulegende Stileigenschaft, z. B. color
, font-size
oder background-color
. 🎜🎜🎜Wert: Der tatsächliche Wert des 🎜-Attributs, z. B. red
, 12px
oder #ffffff
. 🎜🎜🎜🎜Beispiele für CSS-Stilregeln🎜🎜rrreee🎜Die erste Regel gilt für alle Absatzelemente (p
) und legt deren Textfarbe auf Blau und die Schriftgröße auf 16 Pixel fest. Die zweite Regel gilt für alle Elemente mit der CSS-Klasse my-class
, wobei ihre Hintergrundfarbe auf Gelb gesetzt und 10 Pixel Abstand hinzugefügt werden. 🎜Das obige ist der detaillierte Inhalt vonWas sind CSS-Stilregeln?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!