ホームページ  >  記事  >  ウェブフロントエンド  >  HTMLでCSSスタイルを参照するにはどうすればよいですか? HTMLでCSSファイルを参照する3つの方法を紹介

HTMLでCSSスタイルを参照するにはどうすればよいですか? HTMLでCSSファイルを参照する3つの方法を紹介

不言
不言オリジナル
2018-11-08 09:43:086975ブラウズ

HTML で CSS スタイルを参照するには 3 つの方法があります。では、その 3 つの方法とは何でしょうか?この記事では、htmlでcssファイルを参照する3つの方法を詳しく紹介します。

CSS で HTML 文書および XHTML 文書にスタイルシートを適用するには、大きく分けて次の 3 つの方法があります。 (推奨チュートリアル: css ビデオ チュートリアル )

1. 2cdf5bf648cf2f33323966d7f58a7f3f 要素を使用して外部 CSS ファイルを呼び出し、適用します。

2.適用する要素 ドキュメント ユニット

3. 要素にスタイル属性を追加してスタイルを適用します。

2cdf5bf648cf2f33323966d7f58a7f3f 外部 CSS ファイルを呼び出して適用します。 HTMLファイルとは別にスタイルシートを記述し、HTMLファイルから呼び出すCSSファイルを作成します。呼び出しの場合、外部 CSS ファイルは、HTML ドキュメントを記述する

要素内の 要素を介して指定されます。適用されるスタイルがCSSに基づいていることをブラウザなどに通知するには、2cdf5bf648cf2f33323966d7f58a7f3f要素のtype属性の値にtext/cssを指定します。 XHTMLとの互換性やスタイルの修正のしやすさなどを考慮すると、この方法でスタイルシートを設定することを推奨します。

スタイルシートのコンポーネントは外部ファイル(xxx.css)に記述されています。

p {color:blue; line-height:1.5;}

HTML ソース コード

<html> 
<head> 
<link rel =“ stylesheet ”type =“ text / css ”href =“ xxx.css ”>
</ head> 
<body> 
<p>这是一个段落</ p> 
</ body> 
</ html>

c9ccee2e6ea535a969eb3f532ad9fe89 要素を使用してドキュメント単位に適用されます

HTML ドキュメントの 93f0f5c25f18dab9d176bd4f6de5d30e 要素に c9ccee2e6ea535a969eb3f532ad9fe89 要素を記述し、ドキュメントごとにスタイル シートを設定します。 c9ccee2e6ea535a969eb3f532ad9fe89 要素の type 属性の値として text/css を指定すると、適用されるスタイルが CSS に基づいていることをブラウザなどに通知します。


また、a43e6c59218ee94fffa714759615e7c2コメント スタイル シート セクションは、スタイル シートに対応していない古いブラウザで c9ccee2e6ea535a969eb3f532ad9fe89 要素の内容が表示されないようにするためのものです。ただし、近年のほとんどのブラウザは c9ccee2e6ea535a969eb3f532ad9fe89 要素をサポートしているため、 ほぼ問題ありません。

<html>
<head>
<style type="text/css">
<!--
p {color:blue; line-height:1.5;}
-->
</style>
</head>
<body>
<p>这是一个段落。</p>
</body>
</html>

スタイル属性を要素に追加してスタイルを適用する

スタイル属性を要素に追加し、HTML ソース コードにスタイル仕様を直接記述します。 style属性でスタイルを指定するには、文書内で使用されているスタイルシートがCSSであることをブラウザなどに通知するために、93f0f5c25f18dab9d176bd4f6de5d30e要素にe8e496c15ba93d81f6ea4fe5f55a2244要素を追加してスタイル言語を指定します。値として text/css を指定します。多くの場合、指定しなくてもブラウザが自動的にこれを判断しますが、不具合を避けるためにそれを記述する必要があります。

スタイル属性のスタイル指定は、スタイルに部分的な優先順位を付ける場合に便利ですが、HTML ソースが複雑になるとスタイル管理が複雑になる傾向があります。効率的なスタイル管理を目指す場合、CSS部分を外部ファイルに変換することが一般的です。

例: スタイル属性を使用してスタイルシートを直接適用する

<html>
<head>
<meta name="Content-Style-Type" content="text/css">
</head>
<body>
<p style="color:blue; line-height:1.5;">这是一个段落。</p>
</body>
</html>

以上がHTMLでCSSスタイルを参照するにはどうすればよいですか? HTMLでCSSファイルを参照する3つの方法を紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。