CSS3の基礎知識と詳細

CSS3とは

CSS3はCSS2のアップグレードバージョンであり、CSS2.1に基づいて多くの強力な新機能が追加されています。現在、主流のブラウザである chrome、safari、firefox、opera、さらには 360 も CSS3 のほとんどの機能をサポートしており、IE10 も CSS3 を完全にサポートし始めます。

CSS3 スタイルを記述する場合、ブラウザごとに異なるプレフィックスが必要になる場合があります。これは、CSS プロパティまたはルールがまだ W3C 標準の一部になっておらず、ブラウザのプライベート プロパティであることを意味します。ただし、ブラウザの新しいバージョンでは現在プレフィックスは必要ありませんが、前方互換性を向上させるためにはプレフィックスが依然として不可欠です。

注: このコースは IE9 より前のバージョンをサポートしていません。このコースを学習するには、Chrome、Safari、Firefox、Opera ブラウザの最新バージョンを使用することをお勧めします。

CSS3 で何ができるの?

CSS3 は私たちにどのようなメリットをもたらしますか?簡単に言うと、CSS3 は、これまで画像やスクリプトを使用する必要があった多くの効果、さらにはアニメーション効果をわずか数行のコードで実現できるようになります。たとえば、丸い角、画像の境界線、テキストの影とボックスの影、トランジション、アニメーションなどです。

CSS3 は、フロントエンド開発者の設計プロセスを簡素化し、ページの読み込みを高速化します。

CSS3 と完全に下位互換性があるため、既存のデザインを変更する必要はありません。ブラウザは常に CSS2 をサポートします。

CSS3モジュール

CSS3は「モジュール」に分割されています。古い仕様は細かく分割され、新しい仕様が追加されました。

最も重要な CSS3 モジュールの一部は次のとおりです:

セレクター

ボックス モデル

背景と境界線

テキスト効果

2D/3D 変換

アニメーション

複数列レイアウト

ユーザーインターフェース

CSS3 の推奨事項

W3C の CSS3 仕様はまだ開発中です。

ただし、多くの新しい CSS3 プロパティは、最新のブラウザーですでに利用可能です。