2016-01-06 7 views
5

クラスを追加しないで(またはHTMLに触れることなく)div内の最初の要素を対象にする方法はありますか?以下は私のHTMLです:他の兄弟がある場合にのみ最初の要素をターゲットにする

<div class="grid"> 
    <div class="content">I WANT TO APPLY CSS TO THIS</div> 
    <div class="content">But only if there is 2nd .content element in the same parent element</div> 
</div> 
<div class="grid"> 
    <div class="content">Don't apply here</div> 
</div> 
<div class="grid"> 
    <div class="content">Don't apply here</div> 
</div> 
<div class="grid"> 
    <div class="content">I WANT TO APPLY CSS TO THIS</div> 
    <div class="content">But only if there is 2nd .content element in the same parent element</div> 
</div> 

より良い絵のためにこれにいくつかの文脈...私はそれが.grid内部のみ.contentだ場合.contentを中心にしたいです。しかし、2つのdivdivがある場合は、それらを互いに隣り合って浮かせてください。

注:

は、私はすでに私はあなたの選択になり

.grid .content:nth-child(2) { ... } 

答えて

6

.grid > .content:first-child:not(:only-child) { 
 
    color: blue; 
 
}
<div class="grid"> 
 
    <div class="content">I WANT TO APPLY CSS TO THIS</div> 
 
    <div class="content">But only if there is 2nd .content element in the same parent element</div> 
 
</div> 
 
<div class="grid"> 
 
    <div class="content">Don't apply here</div> 
 
</div> 
 
<div class="grid"> 
 
    <div class="content">Don't apply here</div> 
 
</div> 
 
<div class="grid"> 
 
    <div class="content">I WANT TO APPLY CSS TO THIS</div> 
 
    <div class="content">But only if there is 2nd .content element in the same parent element</div> 
 
</div>

:first-child:not(:only-child)することにより、第2 .contentをターゲットにすることができます知っています。

+0

驚くほど素晴らしい。どうもありがとうございます! – Ruby

関連する問題