でもh1要素でマークアップすると文字が大きくなったり、a要素でマークアップすると色が変わって下線が引かれたり、強調すると字体が変わったりしますよね？
さて各要素の説明が終わったらいよいよ装飾を施す方法の説明です。ここまでのHTML要素や属性の説明を見て貰えばわかりますように、HTMLタグの中には文字の大きさを変更したり背景の色を変更したりするものは存在しませんでした。これは最初の方に説明した通り、HTMLタグはコンピュータにその文章の意味をわからせる為だけの物であって、見栄えを定義する物ではないからです。
でもh1要素でマークアップすると文字が大きくなったり、a要素でマークアップすると色が変わって下線が引かれたり、強調すると字体が変わったりしますよね？
そうですね。でもそれはWebブラウザが勝手にそう解釈して表示しているに過ぎないのです。ですから閲覧するWebブラウザによって表示が異なります。そこでそれを出来るだけ作者の意図した見栄えにしようと登場するのが Cascading Style Sheets なのです。
Webページをいかに表現するかを扱った物と思って下さい。HTMLタグでは実現できなかった（させないようにした）表現の部分を Cascading Style Sheets を用いて行うのです。HTMLにもバージョンがあった様に、Cascading Style Sheets の規格にもCSS1とCSS2があります（CSS3はもう直ぐ勧告される筈です）。ここではCSS2に則って説明しますが、基本はどれも同じです。
これより以後はCascading Style Sheetsをスタイルシートと言ったり、CSSと言ったりしますが、特に断りがない場合は（当サイト内では）全て同じ意味として捉えて下さい。ここでは主にCSSと呼びます。また、見栄えや装飾、デザイン、スタイルといった四つの言葉も同じ意味で使用する事になると思われます。
単にスタイルシート（Style Sheets）と呼ぶともっと広義の物にとられる可能性もあります。CSSはCascading、つまりカスケード処理（段階（順序）的処理）に特化したStyle Sheetsという意味で、Webページの見栄えを定義するのに適した形なのです。仕様書ではより厳密に表現するために CSS style sheets という表記がされているそうです。
つまりHTMLタグとは別に見栄えを整える為のCSSという物が存在するって事で良いですか？
はい。そういった簡単なイメージで捉えて下さい。
CSSはHTMLと違って文書の構造を成したり、文章に意味を付けたりする事は出来ません。HTML文書あってのCSSであり、CSS単体では何の意味も成しません。しかしHTML単体ではその表現を指定する事は出来ませんので、HTMLとCSSが合わさって殆どのWebページが構成されています。そんなCSSでも可能な事は基本的には表現だけで、動的な働きは殆ど出来ません。
要するに便利になるって事ですね？
はい。とても簡単に言うとそういう事です。
CSSにもしっかりとした規格があるのですが、それをブラウザが実装（サポート）しているかは別の問題で、HTMLタグとは違って全てのブラウザが全てのCSSを解釈できる訳ではありません。また、例え実装していて同じ記述をしたとしてもブラウザやOSなどの違いによって全く別の表現をする事もあります。デザインを簡単に統一させる為のCSSの筈なのですが何とも皮肉なものですね。しかし見栄えを設定できるのはCSSだけなので折り合いをつけて使用するしかありません。ですので出来るだけ多くの環境で表示確認をする必要が出てくることでしょう。
このように閲覧環境を選ば（制限し）ない利用のし易さをアクセシビリティと呼んだり、Webサイトの使い易さをユーザビリティと呼んだりします。Webサイトを運営して行くに当たって必要な概念ですので覚えて置きましょう。
CSSはユーザがブラウザの設定により自分好みに設定する事ができたり、CSSを適応させないで生のHTML文書だけを取り出す事ができたりと、割と融通の効く便利なものです。
どうしてそんな面倒な事になってるんですか？
私に言われても困ります。ブラウザを作っている人達や規格を決めている人達の問題なので。
[ トップページ ]
[ 目次 ]
[ ページの先頭 ]
[ 前項目 ]
[ 次項目 ]