Heim  >  Artikel  >  Web-Frontend  >  Kann der CSS-Selektor nicht der Name des Tags sein?

Kann der CSS-Selektor nicht der Name des Tags sein?

青灯夜游
青灯夜游Original
2022-09-22 15:34:342380Durchsuche

Es kann sein, dass der Elementselektor den HTML-Tag-Namen verwendet. In CSS findet der Elementselektor bestimmte HTML-Elemente über den Elementnamen (Tag) der HTML-Seite. Die Syntaxstruktur lautet „Elementname {Attribut: Attributwert;}“, wenn der Elementselektor allein verwendet wird aktuelle HTML-Seite. Alle Elemente mit diesem Elementnamen in .

Kann der CSS-Selektor nicht der Name des Tags sein?

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.

CSS-Selektor kann der Name des Tags sein. In CSS verwenden Elementselektoren HTML-Tag-Namen.

CSS-Elementselektor

Der Elementselektor wird auch als Typselektor bezeichnet, der bestimmte HTML-Elemente über den Elementnamen der HTML-Seite findet. Wenn der Typselektor allein verwendet wird, findet er alle Elemente mit diesem Elementnamen in der aktuellen HTML-Seite.

Die Syntaxstruktur ist wie folgt:

元素名 {  
  属性:属性值;  
 }

Es ist zu beachten, dass beim Elementnamen des Elementselektors die Groß-/Kleinschreibung nicht beachtet wird.

Der Beispielcode lautet wie folgt:

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>类型选择器</title>
    <style>
        /* 选择标签名为 h1 的元素,设置字体的颜色为红色 */
        h1 {
            color: lightcoral;
        }
		/* 选择标签名为 div 的元素,设置背景的颜色为红色 */
		div {
			background-color: lightcoral;
		}
    </style>
</head>

<body>
    <h1>一级标题</h1>
    <h2>二级标题</h2>
	<div>sdfgs</div>
	<div>123</div>
	<p>123</p>
	<div>456</div>
	<div>456</div>
</body>

</html>

Kann der CSS-Selektor nicht der Name des Tags sein?

Vorteile des Elementselektors

  • Weniger Code. Anstatt CSS-Code für jedes p-Tag zu schreiben, müssen Sie jetzt nur noch eine Zeile in den Header schreiben.

  • Besser gepflegt. Wenn Sie die Farbe vorher ändern möchten, müssen Sie den Code im Stil jedes p-Tags ändern. Jetzt müssen Sie nur noch den Header ändern.

  • Der Code ist klarer. Bisher waren CSS- und HTML-Codes tatsächlich gemischt und schwer zu unterscheiden. Nach der Verwendung des Selektors ist der gesamte CSS-Code im Header konzentriert, was offensichtlich besser differenziert und klarer ist.

Zusammenfassung

Der Elementselektor kann Stile gleichzeitig auf ein bestimmtes Etikett anwenden, was sehr gut und leistungsstark ist.

(Lernvideo-Sharing: Web-Frontend)

Das obige ist der detaillierte Inhalt vonKann der CSS-Selektor nicht der Name des Tags sein?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn