如何僅將CSS應用於第一個子div元素？

-2

JS撥弄鏈路＃& togetherjs = GPrgjuTmSu

<div class = "node-master"> 
    <div class = "node-1"> 
    <div class ="node-content"> 
     child content 1 
    </div> 
    </div> 
    <div class = "node-2"> 
    <div class ="node-content"> 
     child content 2 
    </div> 
</div>

在上面的例子。我需要定位「子內容1」CSS類以應用不同的字體顏色。但是，警告是我不能直接針對node-1，因爲正在生成HTML（dynalist.io應用程序）。

指定「子內容1」的CSS設置CSS語法是從node-master。

基本上，我需要做的是有使用節點主機和應用其屬性的第一個孩子一個CSS類<div>

來源

2016-12-20 Kagerjay

你可以使用JavaScript來獲取'div'發現它的第一個孩子，並設置樣式的方式。 –

'.node-master> div：first-child .node-content'？ – Pete

，如果你想針對你可以:first-child CSS選擇器播放，例如第一div孩子.node-master：

：

.node-master > div:first-child { 
color: red; 
}

來源

2016-12-20 15:38:06 Troyer

謝謝我在這裏嘗試了其他的解決方案，這是最容易實現的。結果：http://i.imgur.com/tjgfjbh.png – Kagerjay

@AncondaPython我很高興它幫助你:) – Troyer

您可以在父使用:first-child僞選擇

來源

2016-12-20 15:38:41 Dekel

這是CSS的目標元素，而類

.node-master > div:nth-child(1){background-color:red;} 
.node-master > div:nth-child(2){background-color:blue;} 
... 
.node-master > div:nth-child(n){background-color:red;}

希望這可以幫助感謝。

來源

2016-12-20 15:40:19

你需要有每個節點的內容是唯一的CSS出現

<div class = "node-master"> 
    <div class = "node-1"> 
    <div class ="node-content1"> 
     child content 1 
    </div> 
    </div> 
    <div class = "node-2"> 
    <div class ="node-content2"> 
     child content 2 
    </div> 
</div>

，然後簡單地設置顏色屬性。

.node-content1 { 
    color: #1e00ef 
} 

.node-content2 { 
    color: #f44336 
}

在這裏你去：https://jsfiddle.net/fvw3xhv8/

乾杯，祝你好運

來源

2016-12-20 15:48:24 Arch

如何僅將CSS應用於第一個子div元素？

回答

相關問題