CSSとは、HTMLに書かれた文書構造を、きれいに表示するためのWEBページの見た目を装飾する言語です。

ここでは、初心者がもっとも効率よくCSSの書き方を学ぶことができる入門サイトから、実践で役立つCSSマスターとも呼べるプロ達のTipsを紹介しています。本を買ったけどわからない、どこにいけばCSSがわかるようになるのか悩んでいた方はチェックしましょう。

※HTMLについて理解していると、CSSは理解しやすいです。HTMLを学ぼう!

CSS基本解説サイト

ドットインストール～CSS入門

無料動画で学ぶことができるもっともCSSの基礎を学びやすいサイト。

WEBサイトの見た目を制御するための言語CSSの基礎がしっかり確認できます。基本的な文字の色や背景色、画像の配置などができるようになります。

CSS入門（全20回）が終わったら、これからのWEBサイト制作の定番となりそうなCSS3の入門講座も受講しましょう。

こちらも合わせて受講しよう！

• CSS3入門 (全19回)

とほほのスタイルシート入門

CSSタグのクイックリファレンス。ドットインストールで使用されたタグをこちらで確認しながら勉強を進めれば、より理解が深まります。

使用例や、実際でのブラウザ表示もわかるので、初心者にとってわかりやすいです。タグについて詳しく調べたかったらここを開く習慣をつけましょう。

CSSでレイアウトするなら絶対覚えておきたい配置のルール

CSSを使った要素の配置、レイアウトをしっかり学ぶことができます。CSSを学ぶにあたってレイアウトの仕方は、根幹ともいえる部分ですので熟読必須です。

※初心者には理解できないので、ドットインストールの受講後に確認しましょう。

ウィキペディア～Cascading Style Sheets

実践的な利用法ではなく、CSSの概要や歴史について書かれています。CSSについて興味が尽きない方はチェックしてみましょう。S.Sは読んだが、全く頭に入ってこない…もう忘れてしまった。

CSSテンプレート

Free CSS Templates

海外フリーCSSテンプレート配布サイト。探し歩いてみたんですが、ここより良さそうなテンプレート配布サイトは見つかりませんでした。

CSSを実践活用Tips

CSSリセット方法

「なんで、ここにスペース空いちゃうの」って事がないように、ここでリセットCSSを学びましょう。

IEの異なるバージョンごとにスタイルシートを適用する方法

IEのバグ？に対応するための、IE6, IE7, IE8, IE9 へのスタイルシートの適用方法をまとめてくれています。

CSS-EBLOG

初心者が陥りやすいCSSの罠に対する解決策や、小技を紹介してくれています。

CSS(スタイルシート)の基本、小技、テクニック総まとめ

基本から応用テクニックまで、幅広く実用的に使える技を紹介してくれています。常に最新の技を管理人さんが更新してくれているのが有り難い。

少しのコードで実装可能な20のCSS小技集

基本的なCSS設定ですが、初心者にはかなり重宝する内容。そういえば、こんなところでつまづいたな～っと、S.Sも思い返しました。

地味に使えるCSS小技のメモ＆サンプル集

実践で効果的なCSSの応用技が豊富に紹介されています。そんなこともできるのか！ってな情報もあり感動します。

まとめ － CSS学習

見た目を整え、ユーザビリティをあげるのには欠かせないCSSは、WEBサイト制作において欠かせないWEB言語です。HTMLを修得したら、絶対にものにしましょう。

S.SがCSSを本格的に学んでいた頃は、上記で紹介したような素晴らしいサイトはまだなかった（とほほとcollisはあったかな？）ので、「web creators」という雑誌の「CSS付録」を片手に勉強をしました。コピペなどは出来なかったので、手打ちで入力して書き方を学んでいきました。苦労しました。

今では、WEBでCSSを学習できる場が確立しているので本当に羨ましいです。きっと、S.Sが学んだスピードの10倍以上速く、CSSをものにできると思います。

CSSは覚えるタグの量は、HTMLと同じくあまり多くはありませんが、使用方法の理解が難しいです。基礎を学んだら、CSSを使ったレイアウト、文字や背景の装飾、小技を実践し、つまずいたら紹介したWEBサイトを参照するのがもっともいい勉強法です。

CSS習得は、必ずHTMLを学んでから行いましょう。それと、CSSを完全マスターすることは難しいです（次々新しいブラウザがでるので）。S.Sも未だに、Tipsをチラ見してます。