2013-12-17 35 views
3

我想將CSS樣式應用於div的第二個子元素。如何在div中設置第二個元素

這裏是我的HTML

<div class="my"> 
    <div>1</div> 
    <div>2</div> 
    <div>3</div> 
    <div>4</div> 

</div> 

CSS

.my:nth-child(1) { 
    color:red; 
} 

此應用樣式的每個元素。這裏是我的小提琴http://jsfiddle.net/AkCLY/

+1

你只需要「我」的一個實例,所以沒有第二個孩子哈哈,試試」。我的div:第二個孩子(2)「 –

回答

5

它是這樣的:

.my div:nth-child(1) { 
    color:red; 
} 

DEMO HERE

當你想要第二個要改變12

所以.my div:nth-child(2)

DEMO HERE

+0

我相信他正在尋找第二個孩子的風格,你是第一個造型。 –

+0

@ChrisHardie我不認爲我需要指出,因爲它很明顯,但我已編輯我的答案指出。 – Ruddy

0

請試試這個:

.my div:nth-child(2) { 
    color:red; 
} 
0

試試這個:

.my div:nth-child(2) 
{ 
    color:red; 
} 
0

這對我有用:

.my div:nth-child(2) { 
    color:red; 
} 
2

你已經差不多了。只需添加一個空格,它應該工作:

.my > :nth-child(1) { 
    color:red; 
} 
+0

+1用於省略div選擇器 –

+1

(也許您應該添加第一個後代選擇器thoug:.my>:nth-​​child(1)) –

0

你可以試試這個代碼..

.my div:nth-child(2) 
{ 
    color:red; 
} 
相關問題