編集の練習用ページです。

■奇数行と偶数行で色分けできるようにCSSを設定しました。
①緑色で色分け
1行目は 奇数行 です
2行目は 偶数行 です
3行目は 奇数行 です
4行目は 偶数行 です
記述方法
#divid(odd_green){
|1行目は|奇数行|です|
|2行目は|偶数行|です|
|3行目は|奇数行|です|
|4行目は|偶数行|です|
}

②青色で色分け
1行目は 奇数行 です
2行目は 偶数行 です
3行目は 奇数行 です
4行目は 偶数行 です
記述方法
#divid(odd_blue){
|1行目は|奇数行|です|
|2行目は|偶数行|です|
|3行目は|奇数行|です|
|4行目は|偶数行|です|
}

③赤色で色分け
1行目は 奇数行 です
2行目は 偶数行 です
3行目は 奇数行 です
4行目は 偶数行 です
記述方法
#divid(odd_red){
|1行目は|奇数行|です|
|2行目は|偶数行|です|
|3行目は|奇数行|です|
|4行目は|偶数行|です|
}

参考:CSSで追加した記述は以下のとおり
div#odd_green tr.atwiki_tr_odd {
color: #000000;
background: #ccffcc;
}
div#odd_green tr.atwiki_tr_even {
color: #000000;
background: #ffffff;
}

div#odd_blue tr.atwiki_tr_odd {
color: #000000;
background: #ccffff;
}
div#odd_blue tr.atwiki_tr_even {
color: #000000;
background: #ffffff;
}

div#odd_red tr.atwiki_tr_odd {
color: #000000;
background: #ccffff;
}
div#odd_red tr.atwiki_tr_even {
color: #000000;
background: #ffffff;
}

タグ:

練習用
+ タグ編集
  • タグ:
  • 練習用

このサイトはreCAPTCHAによって保護されており、Googleの プライバシーポリシー利用規約 が適用されます。

最終更新:2013年05月20日 23:34