Web教材一覧ネットワーク

HTMLとCSS

キーワード

HTML、CSS、スタイルシート


とかくHTMLとは,文字の大きさ,色,位置などを指定してWebページの見栄えをよくするものだと思われがちです。確かに,HTMLの発展過程では,デザインを指定するためのタグが追加されてきました。
 しかし,HTMLの目的はあくまでも文書の構造を明確にすることであり,表示体裁を目的としたものではありません。例えば,<h1>が<p>よりも大きいフォントで表示されますが,これはInternet Explorer や Netscape Communicator などのブラウザが独自仕様としてそうしているだけで,W3Cの標準規格ではそのような規定はないのです。
 HTMLを本来の目的に合致させるために,HTML4.0以降では,表示体裁のためのタグを「非推薦属性」としています。

表示体裁に関することはCSS(Cascading Style Sheet:スタイルシート)で定義します。
 例えば,次のようになります。

 HTML
   <h1>HTMLの基礎</h1>
   <p class="box1">本章では,Webページ作成用の言語であるHTMLの基礎
   を学習します。HTMLの文法に関しては多くの図書がありますので,ここで
   は,HTMLの意義や概念を中心に説明します。</p>
   <h2>HTMLでの誤解</h2>
   <p>とかくHTMLをWebページの見栄えをよくするためのツールだと思いが
   ちですが,それは重大な誤解です。・・・</p>

CSSの指定がないとき

CSSの指定なし

CSSの指定をしたとき

 CSS
   body {background: yellow}
   h1 {font-size: 200%; color: red; text-align: center}
   h2 {font-size: 150%; color: blue}
   p {font-size: 100%; text-indent: 2%; font-family: "MS P明朝"}
   .box1{border: thin solid gray; margin: 5pt 5% 5pt 5%; padding: 2pt }

CSSの指定あり