CSS能給我基於前一個標題類的段落樣式嗎？

Question

所以我想爲訪談記錄建立一些CSS規則。我想到的格式看起來像這樣：

<h2 class="interviewer">Alice: [00:00:00]</h2> 
<p>Is it ok if I ask you a question now?</p> 

<h2 class="interviewee">Bob: [00:00:03]</h2> 
<p>Sure go ahead.</p> 

我希望段落是基於前面標題的類的特定顏色。有沒有辦法做到這一點，因爲它會使html標記顯着簡化。

Answer 1

您可以使用下面同胞組合子：+

h2.interviewer + p { /* style goes here */ }

Answer 2

肯定的：

h2.interviewer + p { 
    color: red; 
} 

我不完全知道如何與多個段落做雖然。或許，如果你包裹整套段落在div：

<h2 class="interviewer">Alice: [00:00:00]</h2> 
<div> 
    <p>Is it ok if I ask you a question now?</p> 
    <p>More text here.</p> 
</div> 

<h2 class="interviewee"> class="interviewee">Bob: [00:00:03]</h2> 
<div> 
    <p>Sure go ahead.</p> 
</div> 

然後，您可以這樣做：

h2.interviewer + div { 
    color: red; 
} 

Answer 3

順便說一句，還有用於顯示的談話，像新更好的HTML元素介紹<dialog>標籤

http://www.quackit.com/html_5/tags/html_dialog_tag.cfm

UPDATE：

<dialog>元素從未將它變成HTML5。它不存在。