Ascii.jpにてさらばテーブルレイアウト！CSSビギナーの濃い1日として取り上げていただきました。
認証のため、コメントができなった方、大変失礼しました。下記の方法にてコメントできるようになっていますので、ご利用ください。
- 匿名でのログイン（captcha：暗号みたいな英数字の読み取り）
- mixiのIDでのログイン
- 「ID：guesst、パスワード：（書籍の2ページに掲載しているパスワード）」でのログイン
ご質問はこちらのエントリーでコメントとして書き込んでいただければ幸いです。
CSS Nite ビギナーズでいただいたご質問に回答します。
ご質問の内容は「同じ目的を達成する方法として、JavaScriptライブラリを利用する方法とCSSを利用する方法、両方がある場合どちらを利用すればよいのか?」というものでした。
ケースバーイケースです、とお答えしましたが、いくつかのパターンを紹介いたします。
デメリット、メリットを考慮して、どちらの手法がそのサイトに対して有効かを見極めるとよいでしょう。
デメリットの多くは「JavaScriptやCSSをOFFにした場合」、メリットの多くは「作業の効率化」が挙げられます。
続きを読む: JavaScriptを使うべきか？CSSを使うべきか？
よく使われれるid/class の命名については、120ページの「一般的なID名・クラス名から命名ルールを学ぶ」にて紹介しています。
続きを読む: id/class の命名
螺旋デザインさんが毎週更新されている「はじめてのCSS」が参考になると思います。ぜひ読んでみてください。
CSS Niteビギナーズの関連セミナーとして、下記の2つをご紹介します。
いずれもハンズオン（操作を伴う研修スタイル）で、かつ、少人数でのセミナーです。
大人数で聴講スタイルに比べると、より深い理解を得ることができるでしょう。
CSS Niteビギナーズ東京版の最後の質疑応答にて話題に上ったCSSのフレームワークについて補足いたします。
参考記事
Blueprint
参考記事
emastic
参考記事
* 複雑なCSSレイアウトもサクッと実装できるCSSフレームワーク「emastic」:phpspot開発日誌
YUI Grids CSS
参考記事
IE 6には「フロートした要素にマージンを指定すると、フロート方向のマージンが倍近くに増加する」というバグが存在します。
そのため、横並びにしたふたつのボックス間のマージンが広がってしまったり、並ばずに「落ちてしまう」ことがあります。
次のふたつのような対処法がありますので、状況によって使い分けましょう。
続きを読む: フロートしたはずの要素が横並びにならない（IE 6）
ブラウザがサポートしていないセレクタを使用すると、当然、スタイルが反映されません。特にInternet Explorer（以下、IE）7と6は次のセレクタをサポートしていないため、注意が必要です。
| IE 7がサポートしていないセレクタ | IE 6がサポートしていないセレクタ |
| :focus :lang() :before :after |
:focus :lang() :before :after |
| E > F（子セレクタ） E + F（隣接セレクタ） E[attr] E[attr="value"] E[attr|="value"] E[attr~="value"] :first-child |
CSSでスタイルを設定する際には、セレクタの「詳細度」を意識することが大切です。ユニバーサルセレクタは影響せず、タイプセレクタ（要素名）よりもクラスセレクタや属性セレクタが、さらにIDセレクタが優先される、というのが詳細度のルールです（p.078）。指定したスタイルがうまく適用されない問題は、すでに指定されているスタイルの詳細度が高いことが原因になっていることが多いものです。
続きを読む: スタイルがうまく適用されない
最近のコメント