要素の連番の値をリセットするcounter-resetプロパティ
counter-reset
counter-resetは要素の連番の値をリセットする場合に使います。
適用された要素が現れるたびに、指定した名前のカウンタの値が0にリセットされます。
基本データ
| 構文 | セレクタ{counter-reset: 値;} |
|---|---|
| 継承 | × |
| 値 |
|
| 効果 | counter-resetプロパティが指定した名前のカウンタが0にリセットされる |
| 初期値 | none |
| 適用個所 | すべての要素 |
例：
ほげほげ
ほげほげ
ほげほげ
p.hogehoge:before {
content: "項目 " counter(chapter) ". ";
counter-increment: chapter;
counter-reset: section;
}
動作Webブラウザ
 |
Internet Explorer | IE 8以上 |
|---|---|---|
 |
Firefox | Firefox 1以上 |
 |
Safari | Safari 3.1以上 |
 |
Opera | Opera 9.2以上 |
 |
Chrome | Chrome 2以上 |
 |
iPhone/iPad | 全バージョン |
標準JavaScriptによるDOMでの参照方法
[window.]document.getElementById("ID属性値").style.counterResetjQueryを使った参照方法
$('【セレクタ】').css('counter-reset','【値】');
$('【セレクタ】').css({'counter-reset':'【値】'});有限会社タグパンダ
喜安 亮介
TechTargetジャパン
リッチクライアント & 帳票 フォーラム 新着記事
- 次のモバイルアプリはどのフレームワークで作る？ （2012/5/24）
スマホアプリの開発を容易にするJavaScriptのフレームワークが続々と増えている。それぞれの良さや仕組み、何がどこまでできるのかを徹底解剖する - 「LESS＆専用エディター」でCSSをシンプルに書こう （2012/5/23）
「LESS」はCSS初心者に向けた、シンプルなライブラリだ。「LESS」で、変数などのプログラミングの基礎的な考え方もCSSで学ぼう - 学校が世界一のデジタル環境になったら （2012/5/18）
授業はアーカイブに蓄積され、家からも見られる。家族が授業テーマのアイデアを出す。そんな姿が実現されるかもしれない - 1000万ドル調達も夢じゃないクラウドファウンディング （2012/5/15）
クラウドファンディングは、寄付型でも投資型でもない「購入型」が主流。商品を“開発する前に販売”して開発費用を集める逆転のシステムだ
 |
|
|
|
|
RSSフィード 
＠IT 新着記事
キャリアアップ
スポンサーからのお知らせ
- - PR -
イベントカレンダー
お勧め求人情報
転職／派遣情報を探す
*＊先週の人気講座ランキング＊*
〜 Android編 〜
ホワイトペーパー（TechTargetジャパン）
ソリューションFLASH
Copyright(c)
2000-2012
ITmedia Inc.
著作権はアイティメディア株式会社またはその記事の筆者に属します。（著作権について）
当サイトに掲載されている記事や画像などの無断転載を禁止します。
「＠IT」「＠IT自分戦略研究所」「＠IT情報マネジメント」「JOB＠IT」「＠ITハイブックス」「＠IT MONOist」「ITmedia」「誠」は、アイティメディア株式会社の登録商標です。
当サイトに関するお問い合わせは「＠ITへのお問い合わせ」をご覧ください。
著作権はアイティメディア株式会社またはその記事の筆者に属します。（著作権について）
当サイトに掲載されている記事や画像などの無断転載を禁止します。
「＠IT」「＠IT自分戦略研究所」「＠IT情報マネジメント」「JOB＠IT」「＠ITハイブックス」「＠IT MONOist」「ITmedia」「誠」は、アイティメディア株式会社の登録商標です。
当サイトに関するお問い合わせは「＠ITへのお問い合わせ」をご覧ください。