CSS
nth-child() 疑似クラス
任意の順番の要素を指定することができる nth-child() 疑似クラスを使用し、コードをスマートにしましょう! 偶数の要素に CSS を適用 li:nth-child(2n) または li:nth-child(even) 奇数の要素に CSS を適用 li:nth-child(2n+1) または li:nth-child(odd) 指定数ごとの要素に CSS を適用 li:nth-child(指定数n) 指定スタート数から指定数ごとの要素に CSS を適用 li:nth-child(指定数n+指定スタート数) 指定数の要素に CSS を適用 li:nth-child(指定数) 最後から指定数の要素に CSS を適用 li:nth-last-child(指定数) 最初から指定数までの要素に CSS を適用 li:nth-child(-n+指定数) 最後から指定数からの要素に CSS を適用 li:nth-child(n+指定数) 最初の要素に CSS を適用 li:first-child() 最後の要素に CSS を適用 li:last-child()
IE6, IE7 のバグ取りに最も簡単な CSS ハック
イライラする IE のバグ!簡単に解決して、次ぎの作業に取りかかりたいものです。 私は管理するするのが簡単な、以下の方法を使用して対処しています。 IE6 以下に CSS を指定 * html {} IE7 のみに CSS を指定 *:first-child+html {} 一応使用例 * html .your_class { color: #990000; /* IE6 */ } *:first-child+html .your_class { color: #990000; /* IE7 */ }
CSS だけで要素をブラウザの中央に配置
Flash を使わずに CSS で <div> をブラウザの中央に配置する方法 実際に使用した例 » www.ludhaus.com CSS #wrap { position: absolute; width: 800px; height: 600px; left: 50%; top: 50%; margin-left: -400px; margin-top: -300px; } 注意!margin-left は width の半分 margin-top は height の半分 HTML <div id=”wrap”> your contents </div>