保存版！CSS3セレクタの説明書
CSSセレクタについての基礎知識 このブログで何回も説明していますが、念のために説明します。 CSSセレクタはスタイルを適用する対象を指定するものです。普段何気なく使っているclassやidなどもセレクタの１つです。 セレクタ表の説明には属性や要素といった堅苦しい用語が出てきますので図で簡単に説明します。 私のように基礎から勉強していないと、要素や属性と聞いてもピンときませんが、知ってみるとなんてことはないですね。 あと親子関係や兄弟関係などもあまり聞きなれないかもしれません。下の階層にある要素との関係が親子関係で、同じ階層にある要素同士の関係が兄弟関係です。 あと、CSS3と聞いて「どうせIE8以下はダメだし使えない」と思う方もいるかもしれませんが、セレクタに関しては簡単に対応できます。 IE6～8でもCSS3セレクタが利用できるツールの決定版「Selectivizr」をご参考に。 それ
Selectivizr - CSS3 pseudo-class and attribute selectors for IE 6-8
Enhancing IE's selector engine Selectivizr adds support for 19 CSS3 pseudo-classes, 2 pseudo-elements and every attribute selector to older versions of IE. It can also fix a few of the browsers native selector implementations. JavaScript-knowledge: none Selectivizr works automatically so you don't need any JavaScript knowledge to use it — you won't even have to modify your style sheets. Just start
HTML5 & CSS3 ブラウザ別サポート状況
What is an IP Address? An IP (short for “Internet Protocol”) address is a unique number assigned to every machine that connects to the internet. Nowadays, you can have multiple computers behind a router that share a single IP using Network Address Transformation (NAT). If you have ever used a wifi hotspot to access the internet, you’ve shared an IP address with someone. What’s the Difference betwe
[JS]面倒なCSS3のベンダープレフィックスを自動で付与するスクリプト -Prefix free
ページにたった一行記述するだけで、CSS3のベンダープレフィックスを自動で付与してくれるスクリプトを紹介します。 Prefix free via: PrefixFree: Break Free From CSS Prefix Hell [ad#ad-2] Prefix freeの機能 ベンダープレフィックスとは、CSS3で採用予定のプロパティがブラウザに先行実装されており、それらを各ブラウザごとに機能させるためプロパティに加える接頭辞のことです。 「-moz-」「-webkit-」「-o-」「-ms-」などがあります。 例えば、CSS3グラデーションを通常のベンダープレフィックスを使用すると、下記のようなスタイルシートになります。 .download { background-image: -webkit-linear-gradient(transparent, rgba(0,0,0,.3
counter-reset｜プロパティ｜CSS HappyLife ZERO
counter-resetプロパティは、counter-incrementプロパティでセットした<識別子>に該当するカウンタをリセットします。 このプロパティは、contentプロパティの値に<カウンタ>を指定した場合に使用できます。 対応ブラウザ プロパティの解説 値 [<識別子> <整数>?]+｜none｜inherit 初期値 none 適用される要素 全ての要素 継承 します パーセント値 N/A メディア all 値の解説 [<識別子> <整数>?]+ counter-incrementプロパティでセットしたカウンタ名（識別子）と同じカウンタ名を入れると、指定した要素が出現した場所でリセットされます。 リセットしたいカウンタが複数ある場合は、counter-reset: h2count ulcount;のように空白類文字で区切って書きます。 <整数>は、カウンタをいくつにリセット
counter-increment｜プロパティ｜CSS HappyLife ZERO
counter-incrementプロパティは、<識別子>に該当するカウンタを加算します。 このプロパティは、contentプロパティの値に<カウンタ>を指定した場合に使用できます。 対応ブラウザ プロパティの解説 値 [<識別子> <整数>?]+｜none｜inherit 初期値 none 適用される要素 全ての要素 継承 します パーセント値 N/A メディア all 値の解説 [<識別子> <整数>?]+ 1つ以上のカウンタ名を「h2count」とか「section」のように識別子で扱える文字であれば好きにつけることができます。 複数ある場合はcounter-increment: h2count h3count;のように、空白類文字で区切って書きます。 <整数>は、カウンタの増加値を示します。 たとえば、counter-increment: h2count 2見たいな感じで指定すると
counter-increment
Updated 2013.11.07 / Published 2007.02.02 counter-incrementプロパティは contentプロパティで追加されたカウンタ（連番）の値を進めるプロパティです。カウンタは、「1.」「2.」「3.」「4.」の様にして番号を振ったり、「1.1.」「1.2.」「1.3.」「2.1.」の様にして章や節を表す形で番号を振ることもできます。 カウンタの制御は、counter( )、または counters( ) の形式で、括弧内にカウンタ名やスタイル（<list-style-type>）、区切り文字を contentプロパティに指定して行います。通常のカウンタは counter( ) を用いて、同じカウンタ名のリストがネストされた入れ子構造のリスト等の場合には、counters( ) で一括指定が可能です。 値 カウンタ名 カウンタ名 整数値 non
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
