Web プログラマになる

:: be web programmer ::

スタイルを書く場所その１

スタイルを書く場所の１つ目は、style 要素の中です。

HTML ファイルの head 要素内に style 要素を入れ、その中にスタイルを書いていきます。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
          "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
 <head>
  <meta http-equiv="Content-Style-Type" content="text/css">
  <title>３つの言語 その２　CSS</title>

<style type="text/css">
<!--
h2 {
  color: #000099;
  font-size: 120%;
}

p {
  font-size: 90%;
}
-->
</style>

 </head>
 <body>
  <h2>３つの言語 その２　CSS</h2>
  <p>
   見た目やデザインは、スタイルシート（CSS）の役目です。<br>
   スタイルシートを使うと、文字の色や大きさを自由に
   変えることができます。
  </p>
 </body>
</html>

ページ固有のスタイルを指定する場合は、この書き方を使用します。

style 要素の type 属性は、必須の属性です。
この属性によって、デフォルトスタイルシートの内容を上書きするようになります。

「  」は、HTML のコメントの開始と終了を表します。
この中に書いた文字は、画面に表示されません。

コメントを省略すると、スタイルシート未対応のブラウザでは、スタイルが文書として表示されてしまいます。

それを防ぐために、通常はスタイル全体を HTML のコメントで囲みます。

●ブラウザのデフォルトスタイルシート

独自のスタイルシートを使用しない場合、Web ページの表示にはブラウザのデフォルトスタイルシートが適用されます。

デフォルトスタイルシートの内容は、ブラウザによって異なります。ただし、代表的なブラウザであれば、スタイルの内容はほとんど変わりません。

例えば、リンクは青色でアンダーライン、見出しは太字で大きなフォントサイズで表示されます。

独自のスタイルシートを使用すると、これらのスタイルを上書きします。

Web プログラマになる最初のページへ

このページの一番上へ

Web プログラマになる

スタイルを書く場所 その１

●ブラウザのデフォルトスタイルシート

スタイルを書く場所その１