HTML+CSS セレクターとは何かを簡単に紹介

CSSは2つの部分から構成されると定義されています

body{

Style

}

{}より前の部分が「セレクター」で、「セレクター」は{}内の「スタイル」のオブジェクトを指定します。つまり、Web ページ内のどの要素が「スタイル」の影響を受けるかということです

body は HTML 要素であるため、要素セレクターとも呼ばれます

div テーブルスパンなどです。

以下の例を見てみましょう

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>元素选择器</title>
	<style type="text/css">
		p{
			color:red;
		}

		div{
			color:red;
		}


		span{
			color:red;
		}
	</style>
</head>
<body>
			<p>中国</p>

			<div>美国</div>

			<span>日本</span>
</body>
</html>

注:テキスト内には同じスタイルにする必要があるタグがたくさんあるため、CSS スタイルで多くのコードを繰り返し記述する必要があるため、コードは次のとおりです。以下:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>元素选择器</title>
	<style type="text/css">
		p,div,span{
			color:red;
		}
	</style>
</head>
<body>
			<p>中国</p>

			<div>美国</div>

			<span>日本</span>
</body>
</html>

このように書くことの効果は上記と同じですが、コードはきれいになります

学び続ける

新しいファイル

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>元素选择器</title> <style type="text/css"> p,div,span{ color:red; } </style> </head> <body> <p>中国</p> <div>美国</div> <span>日本</span> </body> </html>

提出するリセットコード

自動運転