N個で繰り返すCSSセレクタ「:nth-child(Nn+1)」

Yukimi Sato 340views 更新:2014年5月1日
div{
margin-left:10px;
}
div:nth-child(3n+1){
margin-left:0;
}
<div>margin-left:0;が適用されます。</div>
<div>通常</div>
<div>通常</div>
<div>margin-left:0;が適用されます。</div>

3n+1の場合は、1、4、7、10と3個区切りで繰り返されます。
divを3個でfloatさせる時に指定するとmarginなどが楽に管理できます。

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません