相鄰兄弟選擇器不適用於h3元素

我的HTML DOM在下面給出。我想刪除所有h3元素的margin和padding，這是div的直接兄弟（id =後繼者）。我用相鄰的兄弟選擇器「+」來實現這一點。但我沒有得到預期的輸出。請幫幫我。相鄰兄弟選擇器不適用於h3元素

<style type="text/css"> 
    div#successor { 
     display: block; 
    } 
    div#successor+h3 { 
     padding :0 !important; 
     margin :0 !important; 
     border: 1px solid red; 
    } 
</style> 
<div id="access"> 
<div class="profile clearfix"> 
    <div id="successor" class="memeberDetails"> 
     <h3>Personal</h3> 
     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam purus dolor, vulputate iaculis erat ut, pulvinar commodo orci.Cras ac lorem a lectus luctus vestibulum. Suspendisse odio ligula, fringilla ut ultrices sed, aliquam nec ligula. Praesent porttitor,</p> 
     <br /> 
     <h3>Training</h3> 
     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam purus dolor, vulputate iaculis erat ut, pulvinar commodo orci.</p> 
     <br /> 
     <h3>Contact</h3> 
     <p>Lorem ipsum dolor sit amet</p> 

</div> 
</div> 
</div>

來源

2013-11-04 vandu

如果我正在讀那個權利，而不是他們的兄弟姐妹。 – IMSoP

這就是我的想法，所以你需要選擇直接的孩子 –

是的，你是對的... – vandu

如果你想樣式添加到h3元素你需要選擇其中：

div#successor>h3

相鄰選擇器旁邊的元素對象在'+'運算符的左邊，所以如果你有這樣的結構它就會工作：

<div id="successor" class="memeberDetails"> 
    ... 
</div> 
<h3>...</h3>

來源

2013-11-04 07:08:46 luke

感謝盧克，爲了更好地說明鄰接兄弟選擇器.. – vandu

由於IMSOP說#successor是父，你要選擇它的直接子。您可能需要使用：div#successor>h3 這裏是一個工作示例：http://jsfiddle.net/Au4Vh/

來源

2013-11-04 07:04:03

感謝emil..your解決方案工作正常。 – vandu

相鄰兄弟選擇器不適用於h3元素

回答

相關問題