सीएसएस में + मतलब क्या है?

Question

इस सीएसएस नियम में + का क्या अर्थ है?

h2 + p { 
    font-size: 1.4em; 
    font-weight: bold; 
    color: #777; 
} 

Answer 1

+adjacent sibling combinator है।

चयनकर्ता h2 + p इसका मतलब है कि केवल p कि तुरंत बाद एक h2 आता चयन करता है।

एक उदाहरण:

<h2>Headline!</h2> 
<p>The first paragraph.</p> <!-- Selected [1] --> 
<p>The second paragraph.</p> <!-- Not selected [2] --> 

<h2>Another headline!</h2> 
<blockquote> 
    <p>A quotation.</p>  <!-- Not selected [3] --> 
</blockquote> 

क्या चयनित है और क्या नहीं है:

1. सही पहली h2 के बाद चयनित
   यह p आता है।

2. चयनित नहीं
   यह p के रूप में करने का विरोध किया h2 पहले p के बाद होता है। चूंकि यह तुरंत h2 का पालन नहीं करता है, यह चयनित नहीं है।

   हालांकि, बाद से यह अभी भी h2 तत्व, इस प्रकार अभी तुरंत नहीं, चयनकर्ता h2 + p इस तत्व से मेल नहीं होगा, लेकिन h2 ~ p, general sibling combinator बजाय का उपयोग कर देगा।

3. चयनित नहीं
   यह p एक के भीतर स्थित है, और वहाँ अपने चयनकर्ता को पूरा करने के उद्धरण के अंदर यह पहले कोई h2 है।

Answer 2

यह सभी पी टैग का चयन करता है जो सीधे एच 2 टैग के बगल में हैं। फिर यह कहा गुण देता है।

Answer 3

यह सब p तत्वों कि सीधे के बाद डोम में एक h2 तत्व हैं चयन करता है। इस प्रकार, निम्नलिखित p तत्व स्टाइल जाएगा:

<h2>A heading</h2> 
<p>This paragraph will be styled.</p> 

लेकिन यह नहीं होगा:

<h2>A heading</h2> 
<hr> 
<p>This paragraph will NOT be styled.</p> 

और न तो इस होगा:

<p>This paragraph will NOT be styled.</p> 
<h2>A heading</h2> 

...या इस:

<h2>A heading</h2> 
<section> 
    <p>This paragraph will NOT be styled.</p> 
</section> 

Answer 4

केवल पहले पी है जो प्रभावित करता सीधे निम्नलिखित (सीधे बाद है) एच 2

उदाहरण 1:

<h2></h2> 
<p></p> <!-- THIS ONE IS AFFECTED --> 
<p></p> <!-- THIS ONE IS NOT AFFECTED --> 
<p></p> <!-- NOR THIS ONE --> 
<p></p> <!-- NOR THIS ONE --> 
<p></p> <!-- ETC --> 

उदाहरण 2:

<h2></h2> 
<div></div> 
<p></p> <!-- THIS ONE IS NOT AFFECTED -->