みなさんはCSSの学習をしていませんか？

今回の記事ではCSSとCSS3の違いを解説します！

＼プログラミングスクールを比較／

	DMM WEBCAMP	COACHTECH	RUNTEQ
目指せる姿	WEBエンジニアへの転職	フリーランスエンジニア	WEBエンジニアへの転職
分割払い	○	○	○
補助金	○	×	○
転職保証	○	×	×
受講期間	3ヶ月〜	3ヶ月〜	5ヶ月〜
特徴	【IT業界の転職を一番に考えたい方向け】 大手DMMが運営のプログラミングスクール 転職成功率98.8% 豊富なキャンペーンや補助金制度あり	【フリーランスを目指したい方向け】 フリーランスのエンジニアを最短で目指す エンジニアと共に実際の案件開発を担当	【とことん勉強してから転職したい方向け】 1,000時間（約9カ月）のカリキュラムでしっかり勉強 企業の求める即戦力のWEBエンジニアを目指す
料金	329,350円〜 ※給付金適用後	42万9,000円~	55万円
	公式HP	公式HP	公式HP

CSS3とは

「CSS3」はCSSの最新版になります。

「Cascading Style Sheet(カスケーディング・スタイルシート)」の略であり、ウェブページの見栄えを定義する言語として広く使われています。
単に「スタイルシート」ととも呼ばれます。

ここでは、CSS3を使う上で覚えておくこと、旧バージョンとの違いは何なのかを要点をあげて説明します。

CSSバージョンの最新版

最初のCSSである「CSS1」の規格は、1996年に勧告されました。（仕様が確定ということです）

その後、仕様に改良を加えた「CSS2」が1998年、「CSS2.1」が2011年に勧告されています。その次の規格として2011年から策定が進んでいるのが「CSS3」です。一部勧告されていますが、全体はまだです。

「新しいCSS」ではなく、「便利な仕様が増えたCSS」

CSS3は、まったく新しいバージョンというわけではありません。従来のCSSと互換性があります。これまでのCSSに、新しく便利な仕様を加えた規格がCSS3です。CSS 2.1を中核とし、新たな機能の追加や改良を行っているものになります。基本的な文法(記述方法)に変化はほぼありませんから、従来のCSSで使用していた記述方法はそのままCSS3としても使えると考えて問題ありません。

従来の記述と混在が可能

1つのCSSファイルやソースの中で、新旧のCSSを混在させることが可能です。例えば、「CSS3の記述」と「CSS2.1の記述」を一緒に記述する等です。

従来の記述はそのまま使用可能なので、「CSS3で新しく追加されたプロパティを使いたい」という場合でも、既存部分は何も書き換える必要はありません。今使っているCSSの並びにCSS3の記述を追記するだけで使えます。

HTML5との利用が必須ではない

「HTML5＋CSS3」のように表記されることがよくありますが、CSS3はHTML5と一緒に使わなければならないわけではありません。

例えば、HTML4.01で記述されているウェブページを、CSS3を使ってデザインすることもできます。あくまで実行環境が対応していれば、HTML5にこだわる必要はありません。

特に準備作業なしで使用可能

CSS3の仕様は、そのすべてが勧告されてわけではないですが、代表的な各ブラウザでのCSS3への対応はアップデートで順次進んでいます。

今では、Microsoft Edge, Firefox, Chrome, Safari, Operaなど多くのブラウザでCSS3の記述方法が使えます。ただし、各社で対応状況が違いますので、自身の使用したい機能が実装済みかどうかは調べる必要があります。

「今の働き方に不満はあるけど、日々の業務が忙しくてゆっくり考える時間がない…」
そんな悩みを持つ方に向けて【DMM WEBCAMP】では無料のキャリア相談を実施しています。
ビデオ通話で相談をすることができるため、仕事で忙しい方でもスキマ時間に気軽にカウンセリングを受けることも可能です！
プロのキャリアカウンセラーと一緒に、今後のキャリアについて考えてみませんか？

CSSの書き方に変更はない

CSS3のソースは、従来のCSSソースと何か異なるでしょうか？ 結論から言えば、基本的な部分は何も違いません。自分の記述しているCSSソースが、CSS1なのかCSS2なのか、それともCSS2.1なのかを意識したことのある方は少ないのではないでしょうか。 なぜなら、CSSソースには「バージョンを示す記述」が存在しないからです。 以下のCSSソースは、p要素の文字色を赤色にするだけの簡単なCSSです。

p {
color: #ff0000;
}