フリーランスのためのネットビジネス専門学校 ネットで独立開業を目指す人を応援
フリーランスのためのネットビジネス専門学校 ネットで独立開業を目指す人を応援

alphabetが枠内で改行されない件[CSS]

:nth-child()とは?

・疑似クラスである
・指定した要素が親からみて何番目にあるかを意識してつけてあげる

()の中身

コード 内容
odd 奇数に指定
even 偶数に指定
(?n) ?n倍に指定
(?n+1) ?n倍+1に指定
n n番目に指定
n+3 n+3番目以降に指定
-n+3 nを0として3番目より前に指定

コード

css
.side tr:nth-child(odd){
background-color: #d1c0a5;
}

上記はクラス名「side」の中にいる「tr」の奇数行に対して色を「#d1c0a5」に変更するという指示

:nth-??-child

コード 内容
:last-child 指定した要素の中にいる最後の要素に指定
:first-child 指定した要素の中にいる最初の要素に指定
:only-child 一つだけ

コード

css
.side tr:first-child{
background-color: #d1c0a5;
}

上記はクラス名「side」の中にいる「tr」の一番初めの要素に対して色を「#d1c0a5」に変更するという指示

[紹介元] CSSタグが付けられた新着記事 – Qiita alphabetが枠内で改行されない件[CSS]

コメント

記事に戻る

コメントを残す