CSS3とは

Posted on by

CSS (Cascading Style Sheets)とは

CSS とは、ホームページの見た目や構造などのスタイルを構築するための言語です。
HTML やXHTMLでWebサイト内の各要素の意味や情報の構造を定義し、 CSS で色や文字サイズなどでそれらを装飾することで、
普段目にするホームページがブラウザ上で表示されます。

CSS のバージョン

CSS には、 CSS 1、 CSS 2、 CSS 3という追加のパッケージ名があります。
CSS の後ろの番号は、レベルを表しています。
WWW ブラウザ が CSS 1対応となっていれば CSS 1のみ対応、WWW ブラウザ が CSS 2対応となっていれば CSS 2と CSS 1に対応、WWW ブラウザ が CSS 3対応となっていれば CSS 3、 CSS 2、 CSS 1に対応しています。
レベルが上がるごとにできることが増えているので、全てのバージョンについて知りたい場合でも、 CSS 1から勉強していけば無駄になることはありません。

CSS 1でできること

CSS 1は1996年に発表されました。

  • フォント プロパティ
  • 色や背景のプロパティ
  • テキスト プロパティ
  • リスト
  • ボックスプロパティ
  • 表示の確立

CSS 2( CSS 2.1)で追加された機能

CSS 2は1998年に CSS 1の上位互換として発表されました。
さまざまな機能が追加されましたが、仕様書の定義が不明瞭だったため、
各ユーザー間で実装に互換性がないという事態が発生しました。
これを受けて、2011年に改訂版として CSS 2.1が発表されました。
現在は、実装に際しては、 CSS 2.1を基本仕様と見なしています。

  • 表示媒体によって自動的にスタイルシートが変更できるようになった
  • 音声 ブラウザ への対応

(音声 ブラウザ とは、ホームページの内容を解析して合成音声で読み上げるソフトウェアのことです。主に視覚障害者 ユーザー がホームページを閲覧する際に利用されます。)

  • 印刷媒体への対応
  • フォント や色などの表示機能の拡大
  • 表現方法の広がり

CSS 3で追加された機能

CSS 3は2011年に発表されました。
全体がモジュール化(まとまりのある要素、という意味)され、 ユーザー はどのモジュールを利用するのか、
自由に選択できるようになりました。

  • グラデーション
  • 変形
  • 角を丸くする
  • ボックス レイアウト
  • ボックスシャドウ
  • テキスト シャドウ
  • 段組み
  • アニメーション
  • 複数背景
  • 装飾表現の多様化

ブラウザ の対応状況

まだ全てのブラザに完全に対応している訳ではないので、プロパティによっては、
ベンダープレフィックスを用意する必要がある場合があります。

対応している ブラウザ

  • Internet Explorer 9/10/11
  • Firefox 29
  • Google Chrome 34
  • Safari 5
  • Opera 12

まとめ

CSS 3についてご存知の方は多いかもしれませんが、各バージョンごとの違いまで知っている方は少ないと思います。
細かい内容まで把握しておく必要はありませんが、どのような機能が追加されてきているのかで、
今Webデザインに求められる要素を垣間みることもできます。
なかなか調べる機会もないと思いますので、まめ知識として知っておくとよいでしょう。