不同的CSS樣式

目前，我已經準備好以下一段代碼需要被稱呼：不同的CSS樣式

<div class="clearfix text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item">  
    <p>summary</p> 
    <p>body</p> 
</div>

我想保持HTML原樣和風格的「P '的總結和身體以不同的方式。

這可能嗎？怎麼樣？謝謝！

來源

2016-07-27 MoGuL

是的，它是：

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

 
div p:nth-child(2){ 
 
    color: blue; 
 
}

<div class="clearfix text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item">  
 
    <p>summary</p> 
 
    <p>body</p> 
 
</div>

來源

2016-07-27 12:19:18 Atoom

您需要使用：第n個孩子（）cssSelector爲每個標籤應用不同的樣式。看下面的例子。

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

div p:nth-child(2){ 
    color:green; 
}

來源

2016-07-27 12:17:37

你可以這樣做：

<p style="background-color:#000000;"></p>

還是這樣認爲：首先，添加了「身份證」標籤在你的段落標籤。

<p id="bodyParagraph"></p>

二，關於head標籤包括：

<style> 
    #bodyParagraph{ 
     background-color:#000000; 
    } 
</style>

來源

2016-07-27 12:24:01

爲什麼你不希望特定的類添加到對身體的段段總結和另一個？沒有錯。 <p class="summary">和<p class="body">各自的風格。

如果你真的想要避免使用每個特定的類，我會建議檢查：第一孩子和第n孩子僞元素，所以你風格的特定div的第一段的一種方式和其他任何段落不同的方式。

假設體段可能有多個段落，我強烈反對這種做法，因爲這將是哈克，較爲混亂，並有更多的時間不僅僅是讓每一個段落了自己的風格消耗。

來源：

W3Schools - first-child pseudo-element和W3Schools - nth-child pseudo-element

來源

2016-07-27 12:29:26 akaPorto

不同的CSS樣式

回答

相關問題