TOP > スタイルシート基本知識 > HTMLファイル一つだけにスタイルシートを適用したい場合。
HTMLファイル一つだけにスタイルシートを適用したい場合。
「Webページ内の要素の書式を統一する」とは、Webページ全体にスタイルシートで書式をコントロールすることです。
ただ、一つのWebファイルにだけスタイルシートで書式を反映させることもできます。
この場合は、HTMLファイルのヘッダー部(<head>~</head>の部分)のなかに、 <style type="txt/css">~</style>を挿入し、 ~のところに適用したいスタイルシートを記述することになります。
スタイルシートの本文を記述する時に、注意すべきことは本文の前に「<!--」後ろに「-->」を記述して、 本文を囲む必要があることです。「<!--」「-->」はコメントの挿入を意味しており、コレで囲まれた部分は、 Webページを表示する際に無視されます。スタイルシートに対応していないブラウザがスタイルシートの部分を表示しないようにするために、 この点は気をつけましょう。
また、この手法と、 「特定の要素にだけ、スタイルシートを適用」する手法は共存させることができます。同じタグに対し、異なる書式を指定した場合は、 特定の要素に指定された値が優先されます。
特定の要素にスタイルシートを適用>HTMLファイル一つだけにスタイルシートを適用
HTMLファイル一つだけにスタイルシートを適用する
<style type="text/css">
<!--
要素名 {プロパティ:値; プロパティ:値; … }
要素名 {プロパティ:値; プロパティ:値; … }
……
-->
</style>
HTMLファイル一つだけにスタイルシートを適用する"のサンプルページはコチラをクリック!
- サンプルページのコードは以下のとおりです。
|
<html> <head> <title>HTMLファイル一つだけにスタイルシートを適用したい場合のサンプル</title> <meta http-equiv="content-type" content="text/html"> <meta http-equiv="content-style-type" content="text/css"> <style type="text/css"> <!-- h1{ color: red; background-color: yellow; } --> </style> </head> <body> <h1>このWebページ内の</h1> <h1><h1>タグで囲まれたテキストは</h1> <h1>すべて文字の色が赤色で、背景色が黄色になります。</h1><br> <p>h1要素を、文字色を赤色、背景色を黄色に設定しています。p要素であるこの文章はご覧のとおり変化ありません。</p> </body> </html> |
[
スタイルシート基本知識 ]