CSS3について知っておきたいことのまとめ
CSS3には興味深い様々なプロパティがありますが、これらを勉強するにあたって知っておきたいCSS3の基礎をまとめてみます。 過去の記事に手を加えたものや新たに書いたものなど幅広くまとめてみましたので、ぜひ抑えておいてください。 今回は結構ボリュームもあるので目次を作っています。 1. スタイルシートの構造 CSS3に限ったことではないですが、CSSの構造は下の図のように、セレクタ、プロパティ、値となっています。 もちろんプロパティと値は一対です。CSSといえば、プロパティのイメージが強いですが、セレクタも結構奥が深いです。 CSS3ではセレクタもプロパティも新たに追加されていますので、違いをちゃんと理解しておきましょう。 2. CSS3セレクタ CSSセレクタはスタイルを適用する対象を選択するものです。普段何気なく使っているclassやidなどもセレクタの１つです。 CSS3セレクタはW3
float解除の決定版。clearfixを考えたら、進化した。
現在この中でclearfixでよく使用されているプロパティは display:inline-block; height:1%(min-height:1%) zoom:1; でも良く考えたら、全て微妙です。 zoom:1はIEの独自仕様ですし、heightを使用する場合は、IE6,7に対応させるために2つのプロパティが必要です。 display:inline-blockもボックスの要素を変形させることになります。 hasLayoutのスイッチを見た時に、一番理に適ったプロパティはwidthかなと思いました。 子要素を囲む要素として、divやulなどデフォルトCSSがdisplay:blockのプロパティのものが多く、display:blockのプロパティの場合、width:100%で問題ないと思ったからです。 現在のブラウザ状況に適したclearfix 上記を踏まえ見直したclearfixが
CSS逆引きリファレンス（目的別プロパティ辞典）-HOME PAGE ZERO ガイド-
はじめに -目的別スタイルシート一覧- スタイルシート（CSS）逆引きリファレンスとは、スタイルシートのプロパティを目的別にまとめ、あなたの目的に応じたリンクをクリックしてもらうことによってその役割を果たすタグを調べることができます。また、当サイトではIE独自のプロパティなども紹介しています。なお、アルファベット順のスタイルシートの一覧なども用意していますので合わせてご利用してくれれば幸いです！ 当サイト全体からキーワードで検索したい場合は、検索窓をご利用ください。 ※タグの説明の前に「」のチェックが付いているプロパティは、ブラウザのシェアが多いブラウザの「 IE 」や「 NN 」では対応していないプロパティです。 ※説明の後ろに「-ブラウザ名-」と標記されていた場合は、そのブラウザの独自の仕様や機能です。ちなみに「 -IE- 」は「 Internet Explorer 」のことで、「-N
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
