CSS3入門道場

CSS3の紹介

始めに・注意事項等

本書をお買い上げいただき、誠にありがとうございます。本書は、CSS3の機能をなるべく分かり易く、なるべく役立つサンプルと共にお届けするよう執筆しました。CSS3の機能は膨大で、また未だ流動的な部分も多いです。本書で全てのCSS3の機能をカバーしている訳ではありません。CSSの仕様策定状況、ブラウザの実装度合いや実用度などを考慮していますが、主要な機能はカバーしていると思います(Web Fonts、Grid Layoutはカバーしていません)。また、本書を読み進めるに当たり、CSS2(2.1)までの知識は必須となりますので予めご了承下さい。

またCSS3は、中には流動的な部分もあるため、本書の執筆時点では当てはまっていたものが、将来的に変更になっている点もあるかも知れませんが、予めご了承下さい。

本書の紹介サイト
http://css3.my-learn.net/

サンプルファイル

本書では、実際にブラウザで確認しないと分からないような機能は、適宜サンプルファイルにリンクを張っています。サンプルファイルの一覧は、本書の紹介サイトからもご確認いただけます。サンプルファイルは、Windows版のChrome、Firefox及びIE11にて動作確認を行っていますが、全てのサンプルがこれら全てで動くという訳でもありません。とは言え、ほとんどのサンプルでは動きますが、一番Chromeをお勧めします。また、Macの方も、章によっては全く確認出来ないため、Chromeで表示確認をお願いします。またスマホなどの場合、マウスオーバーやウインドウのサイズ変更などが難しい為、なるべくPCでの確認をお願いします。

本書中のサンプルコードは、各々のコードにおいて利用していただいて構いません。但し、販売目的やアフィリエイト目的などでコードのかなりの部分を利用する場合は、筆者への許可が必要になります。

本書内で紹介するコード(CSSなど)は、なるべく簡潔に記すため、余計な装飾周り(後述するベンダープレフィックス含め)を省略することがあります。但し、実際のサンプルでは、それらも含まれている事がありますので、予めご了承下さい。

その他

各章の上部では、その章のメニュー、参考となるサイトのURL、ブラウザサポート状況を先に掲載しています。 説明する前からブラウザサポート状況を書くのも変かも知れませんが、後から見返す際にはその方が便利な為、そのようにしています。

本書では、画像が多く使用されています。高解像度のタブレットなどでは、場合によっては小さいと感じるものもあるかも知れません。その場合は、ダブルタップ(or 長押し)して、画像を拡大して表示できます。

AmazonのKindle for PCを入れますと、パソコンでも本書をお読みいただけますので、是非ご利用下さい。

これ以降、本書で各CSSプロパティを紹介して行きますが、CSS3ではどのプロパティも共通で、initialというキーワードが使えます。これは、そのプロパティの「初期値」を指定するキーワードです。元の初期値を設定する際に便利です。このキーワードについては、各プロパティの紹介では省略しております。ちなみに、各ブラウザが自動でセットするデフォルトのスタイル(値)とは別物で、あくまでCSSの仕様で「初期値」と定義されているものです。執筆時点では、IE(IE11も)を除くモダンブラウザで、このキーワードに対応しています。

CSS3の生い立ち

それではCSSの歴史から振り返ってみましょう。まず、CSS3に至るまでには、CSS1、CSS2、CSS2.1があります。 CSS1は1996年、CSS2は1998年に正式な仕様(勧告)となりました。CSS2.1は、CSS2でブラウザで実装されなかった機能、相互運用が難しい機能や仕様が不明瞭なものなどを整理する形で仕様の策定が始まりましたが、それが正式な仕様となったのは、何と2011年6月の事です。参照:Cascading Style Sheets History
CSS2が正式な仕様になってから、長い間暗中模索していた形になります。そして、本書で紹介するCSS3ですが、こちらは遡ること1999年頃から作業が始まっています。CSS3では、今までのCSSのように1つの大きな仕様ではなく、各機能ごとに仕様をまとめて行くという、モジュール構成になっています(モジュールというと小難しく聞こえますが、分かり易く言えば、機能です)。仕様が巨大になるから、各モジュールごとに分け、各モジュールごとに仕様を策定できるようにする為です。またブラウザ側でも、そのブラウザの特性にあったモジュールを採用するという選択もできるようになります。
このように今後はモジュール構成を取るため、いわゆるCSS2.1より後に策定されているものをまとめて(総称として)CSS3と呼びます。各モジュールごとに仕様の進捗具合もまちまちで、既に正式な仕様(勧告)になったものもあれば、今後まだ仕様の変更があるものもあります。
CSS3の仕様の進捗具合と各ブラウザの対応状況は、また別に考えなければなりません。CSS3の機能が正式になったからと言っても、それがすぐに現場で使えるとは限りませんし、その逆も然りです。既に正式な仕様と勧告され、各ブラウザでも十分対応しているものは、積極的に利用することができます。

Copyright 2015 CSS3入門道場 All Rights Reserved.