ホームページ > 記事 > ウェブフロントエンド > CSS セレクターをタグの名前にすることはできませんか?
CSS セレクターをタグの名前にすることはできませんか?
- 青灯夜游オリジナル
- 2022-09-22 15:34:342348ブラウズ
が可能です。要素セレクターは HTML タグ名を使用します。 CSS では、要素セレクターは HTML ページの要素 (タグ) 名を通じて特定の HTML 要素を見つけます。構文構造は「要素名 {属性: 属性値;}」です。要素セレクターを単独で使用すると、現在の HTML ページ。 内のこの要素名を持つすべての要素。
このチュートリアルの動作環境: Windows 7 システム、CSS3&HTML5 バージョン、Dell G3 コンピューター。
CSS セレクターにはタグの名前を指定できます。 CSS では、要素セレクターは HTML タグ名を使用します。
css 要素セレクター
要素セレクターはタイプ セレクターとも呼ばれ、HTML ページの要素名を通じて特定の HTML 要素を見つけます。タイプ セレクターを単独で使用すると、現在の HTML ページ内でこの要素名を持つすべての要素が検索されます。
構文構造は次のとおりです。
元素名 {
属性:属性值;
}要素セレクターの要素名は大文字と小文字が区別されないことに注意してください。
#サンプル コードは次のとおりです。
<!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>
- コードが少なくなります。 p タグごとに CSS コードを記述する代わりに、ヘッダーに 1 行を記述するだけで済みます。
- メンテナンスが改善されました。以前は、色を変更したい場合、各 p タグのスタイルのコードを変更する必要がありましたが、現在はヘッダーを変更するだけで済みます。
- コードがより明確になりました。以前は、実際には CSS コードと HTML コードが混在していて、区別するのが困難でした。セレクターを使用すると、すべての CSS コードがヘッダーに集中し、明らかに区別され、明確になります。
要素セレクターは、スタイルを特定のタグに一度に適用でき、非常に優れており強力です。
(学習ビデオ共有:
Web フロントエンド以上がCSS セレクターをタグの名前にすることはできませんか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：CSSで翻訳は何を意味しますか次の記事：CSSで翻訳は何を意味しますか