スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
このエントリーをはてなブックマークに追加

[CSS]nth-child()の実装

例えばこういう形のXMLデータがあったとします。
//サンプルXML

ラベル



データを指定するときは大抵

//idやclassを指定して、レイアウトを決定する
#div_title {
/*div範囲をwidth:400pxに指定*/
width:400px;
}


と、定められたidに対して指定したり、inputやradioなどの属性を指定してそのレイアウトを書き込みます。

しかしこのサンプルにはdiv_titleの中に指定のないdivが含まれています。

この指定のないdivを指定するためには、nth-childというもの利用します。
//idのついたdivの中にある無指定のdivを指定する
#div_title div:nth-child(1){
/*div範囲をwidth:400pxに指定*/
width:400px;
}


その他、数字の部分に複雑な指定を施すことができます。
参考URL:
CSSの「:nth-child」をマスターするための図解いろいろ
nth-child() 疑似クラスを試してみる
このエントリーをはてなブックマークに追加

tag : css

コメントの投稿

非公開コメント

Translation


上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。
プロフィール

チーズくん

Author:チーズくん
個人的メモをただ羅列しています。
twitter:@cheese1038

バロメーター
最新記事
最新コメント
最新トラックバック
月別アーカイブ
カテゴリ
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。