個別記事

前後の記事

CSS3 の Selectors と CSS3 Advanced Layout Module

この記事が属するカテゴリー
CSS

Selectors

増えているものや削除されたものがあるみたいね。とりあえず、メモとして現状 CSS3 で追加されたセレクタを全て抜き出してみる。

E[foo^="bar"]
foo 属性値が文字列 bar で始まる E 要素にマッチ
E[foo$="bar"]
foo 属性値が文字列 bar で終わる E 要素にマッチ
E[foo*="bar"]
foo 属性値が部分文字列 bar を含んでいる E 要素にマッチ
E:root
ドキュメントのルートである E 要素にマッチ
E:nth-child(n)
親の中で n 番目の子である E 要素にマッチ
E:nth-last-child(n)
親の中で最後から数えて n 番目の子である E 要素にマッチ
E:nth-of-type(n)
同じ要素名を持つ兄弟の n 番目の E 要素にマッチ
E:nth-last-of-type(n)
同じ要素名を持つ兄弟の最後から数えて n 番目の E 要素にマッチ
E:last-child
親の中で最後の子である E 要素にマッチ
E:first-of-type
同じ要素名を持つ兄弟の最初の E 要素にマッチ
E:last-of-type
同じ要素名を持つ兄弟の最後の E 要素にマッチ
E:only-child
親の中で唯一の子である E 要素にマッチ
E:only-of-type
親の中で唯一の要素名を持つ E 要素にマッチ
E:empty
子（テキストノードも含む）を全く持たない E 要素にマッチ
E:target
参照 URI のターゲットとなる E 要素にマッチ
E:enabled
E:disabled
有効または無効であるユーザインターフェース要素 E にマッチ
E:checked
チェックされているユーザインターフェース要素 E にマッチ（ラジオボタンやチェックボックス等）
E::selection
ユーザによって選択 / ハイライトされている E 要素の一部にマッチ
E:not(s)
単純セレクタ s にマッチしない E 要素にマッチ
E ~ F
E 要素が先に出現している F 要素にマッチ

CSS3 Advanced Layout Module

まだ未読だけど、最初の 3.Template-based positioning を見ただけでもなんか色々と凄そうね。グリッド配置が自由自在って感じ？。あと、タブっぽいやつも簡単そう。Example のソースは、なんとなく萎える感じだけど。

2005-12-21T15:16:04+09:00 | コメント (2) | トラックバック (2) |はてなブックマーク

関連性が高いエントリー 5 件

トラックバック

このエントリーのトラックバックURL:
http://WWW.lucky-bag.com/cgi/mt/mt-tb.cgi/352

このリストは、次のエントリーを参照しています: CSS3 の Selectors と CSS3 Advanced Layout Module:

我的春秋 さんからのトラックバック
CSS 3 セレクタ最終草案リリース
対応ブラウザ: ？（未確認） （CSS Level 3） CSS 3 セレクタ [続きを読む]
2005年12月23日 21:49
Imaginary Affair さんからのトラックバック
CSS3 Selectors
Lucky bag::blog: CSS3 の Selectors と CSS3... [続きを読む]
2005年12月23日 23:52

コメント

ゆう さんからのコメント

はじめまして。いつも愛読させてもらってる ゆう といいます。

すみませんが、トラバが重複しちゃいましたので、どちらか削除していただければ幸いです。慣れないもんで本当にすみません。(T-T)

CSS 3 セレクタがあとちょっとで勧告。これでちょっとでも class や id が減る方向で進んでいくと楽なんでっすけどね。まずは IE 7 次第ですけど。（でも後方互換を考えると意外に遠い未来の話になるのかも？！）

2005年12月23日 21:56
e-luck さんからのコメント [TypeKey Profile Page]

はじめまして。
重複の方、削除しておきました。

>でも後方互換を考えると意外に遠い未来の話になるのかも？！

そうですねー、実際にこれらが普通に使えるようになるのは IE 次第でしょうね。IE7 リリース後にこまめにレンダリングエンジンに手を加えてバージョンアップしながら実装していってくれれば良いのですが。

2005年12月23日 22:41

コメントしてください

コメント内ではタグは一切使えません。コメント内にてタグを表記したい場合は、お手数ですが、文字実体参照を利用して < を &lt; 、> を &gt; とそれぞれ置き換えてください。




保存しますか?


(V) (P)