CSS スタイルシートを使用する理由-CSSチュートリアル-php.cn

CSS スタイルシートを使用する理由

青灯夜游

リリース： 2023-01-04 09:37:29

オリジナル

3157 人が閲覧しました

css スタイルシートは、開発者がドキュメントの情報コンテンツを、ドキュメントの表示方法という些細な事柄から分離するのに役立ちます。つまり、スタイルをコンテンツから分離することで、次のような利点があります。同じコンテンツを異なるスタイルで異なる目的を達成する; 2. 重複を避ける; 3. メンテナンスを容易にする; 4. Web ページのコード量を削減し、Web ページの送信効率を向上させる。

CSS スタイルシートを使用する理由

#この記事の動作環境: Windows10 システム、css3、thinkpad t480 コンピューター。

(推奨チュートリアル:

CSS ビデオチュートリアル )

CSS スタイルシートを使用する理由

CSS は、開発者がドキュメントの情報コンテンツを、それをどのように提示するかという些細な事柄から分離するのに役立ちます。文書の表示方法に関する小さなことは、文書のスタイルと呼ばれます。スタイルをコンテンツから分離すると、次のような利点があります。

重複を避ける
メンテナンスが容易になります
同じコンテンツを異なるスタイルで使用して、異なる目的を達成できます

通常は、スタイルではなく HTML を使用してページのコンテンツを記述し、CSS を使用してコンテンツではなくページのスタイルを指定します。もちろん例外はあり、HTML にはスタイルを指定するためのメソッドがいくつか用意されています。たとえば、HTML では、タグを使用してテキストを太字にすることができ、タグでページの背景色を指定できます。 CSS を使用する場合、すべてのスタイル情報が 1 か所に保持されるように、通常は HTML のスタイル機能の使用を避けます。

CSS スタイルシートを使用する主な目的は、Web デザインの分業とコラボレーションを促進することです。たとえば、HTML 部分は 1 人またはチームで完成し、JS プログラム部分も 1 人で完成させます。 CSSもプロに任せてやれば確実に効率アップ家の装飾と同じで、ハードもソフトもプロのエンジニアリングチームがやりますきっと早くてきれいに仕上がります。逆に、すべての作業をエンジニアリングチームに引き継いでしまうと、品質や工期が保証されません。

さらに、Web ページの CSS スタイルシートは、別の Web ページや他の Web サイトの Web ページでもそのまま使用できます。これは、CSS を再利用できることを意味し、コードの量を大幅に削減できます。をWebページ上に配置することで、Webページの送信効率が向上し、Webサイトの見た目の統一性を保つことができ、もちろんWebデザイナーの作業負荷も軽減できます。これは、ある家の装飾スタイルを同じような構造の別の家に完全にコピーできるのと同じで、家の装飾コストを削減できるだけでなく、統一された装飾スタイルを維持することもできます。

実践: HTML ドキュメントのスタイルシートを作成する
スタイルシートを作成する

1. テキストファイルを作成します。このファイルがスタイルになります。シート。 style1.css

2 という名前を付けます。CSS ファイルで、次のコード行をコピーしてファイルを保存します:
strong { color: red; }
ログイン後にコピー
ドキュメントとスタイルシートをリンクします。
1. 別のテキストファイルを作成します。このファイルがドキュメントになります。任意の名前を付けます。
2. HTML ファイルで、次のコードをコピーして、行に独自のスタイルシートを引用してください:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Sample document</title> <link rel="stylesheet" href="style1.css"> </head> <body> Cascading Style Sheets </body> </html>
ログイン後にコピー
3. ファイルを保存し、ブラウザで開きます。スタイルシートにより、次のようにタグ内の文字が赤で表示されます:
##C
ascading
S
tyle Sheets プログラミング関連の知識について詳しくは、プログラミングコースをご覧ください。！
以上がCSS スタイルシートを使用する理由の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。