CSS の勉強中に困ったら

Category : CSS

CSS の勉強中に色々困ることが起きて検索するのですが、だいたい同じところに行き着くので自分用のリンク集も兼ねてまとめておきます。

仕様を確認する

とりあえず W3C を見に行った方が早い。
そもそもプロパティや値について分かっていない場合はここで解決することが多い。

CSS current work & how to participate
現在の状況と仕様書の目次。
CSS3の日本語訳集 – 血統の森 web実験小屋
日本語訳へのリンク集。

W3C の目次から探すのが面倒なときは Google で「w3.org (プロパティ名)」で探すと早い。「devs.w3.org」と「www.w3.org」を分けて検索するのもいいと思う。

ブラウザの対応と実装

対応しているかどうかだけの場合は以下の2つのサイトで事足りる場合も多い。

When can I use… Support tables for HTML5, CSS3, etc
対応状況表。まずここに調べに行くことが多い。
CSS – Contents and compatibility
有名なサイト。対応状況とサンプル。

「だいたいの対応状況は分かったけど実際のところどうなの?」となったら、各ブラウザのサイトに行く。

Cascading Style Sheets
MSDN の Internet Explorer Developer Center にある、CSS リファレンス。日本語版(未翻訳多い)古い版の日本語版 もある。
対応バージョンが書かれていたりいなかったりする。そのうち更新されるといいなと思っている。
Mozilla CSS support chart – MDN
Mozilla の対応状況。日本語版 もある。個別に見たい場合は CSS Reference から探すのもいい。
MDN の各プロパティのリファレンスには他ブラウザの対応状況も載っていたりするのでとても便利。たぶん一番よく使っている。
Safari CSS Reference: Introduction to Safari CSS Reference
Safari のリファレンス。ちょっと見づらいけど詳しく載っている。
Opera: Opera Presto でサポートされる Web 仕様
面倒だけどサイドバーにある Presto のバージョンごとに調べるしかない。
他にいいページあったら教えてほしいです……。

「これ対応されるの?」とか「これバグじゃね?」と思ったら

Mozilla と Webkit はすぐ検索できる。
IE は分からない……。

Bugzilla@Mozilla
Firefox ならここで検索。「CSS (問題の用語)」みたいに検索すると大体は出てくる。
WebKit Bugzilla
Webkit ならここ。検索の仕方も一緒。
Google Chrome Forum – Google グループ
Chrome のユーザーフォーラム。バグの解決策が見つかることもある。
My Opera – フォーラム
調べたいソフトウェアのフォーラムから探す。

他には、たぶん「ググれ」が一番近道。
適当な英語で検索しても結構見つかる。日本語で駄目だったら英語で検索する癖をつけておくと解決しやすい。

Stack Overflow
超有名な Q&A サイト。ググった結果、ここに行き着くことも多い。

Twitter などで「こうしたいけど上手くいかない」みたいなこと書いたら教えてもらえることもあるけど、まずは自分で調べる。
リプライが来たらラッキー程度に思っておくべき。

ブラウザのブログ

普段からチェックしておくのもいいと思います。

IEBlog – Site Home – MSDN Blogs
Internet Explorer のブログ。IEBlog 日本語 もある。
The Mozilla Blog
日本語はこっち
Mozilla Hacks も。
Google Chrome Blog
Chrome はここ。Chrome Releases も合わせて。
Surfin’ Safari – The WebKit Blog
Safari というか、Webkit はここで。
Opera Desktop Team – Desktop Team
デスクトップ版の Opera のブログ。

英語のページが多いですが、日本語の情報しか見つからないものもあったりするので、両方で検索してみる癖をつけておいたら近道になると思います。
英語が読めないとか言ってないで、オンライン翻訳でも使いながら調べるといいんじゃないでしょうか。自分はそうしてます。

こういう困ったときに検索して行き着くページには CSS のコードが書かれていることが多いので、それを見ながら説明文を読むと分かりやすいかと。CSS のコードは何語のページでも同じですし。
間違って解釈してしまったら……まあ自信がないときはどっかにコード載せて突っ込み待ちするのもありです。jsdo.it の Discussions に投稿するのもいいかと思います。

他にも探す方法は色々あるでしょうが、自分の場合はこんな感じです。

Leave a Reply