CSS अड्जैक्ट सिस्टर सेलेक्टर

अधिकर्षी भाइ-बहन चयनकर्ता (Adjacent sibling selector) एक एलीमेंट को चुन सकता है जो एक अन्य एलीमेंट के बाद आता है और दोनों को सामान्य पैरेंट एलीमेंट है

अधिकर्षी भाइ-बहन को चुना जाता है

यदि आप एक एलीमेंट के बाद आने वाले एलीमेंट को चुनना चाहते हैं और वे एक साथ के पैरेंट एलीमेंट हैं, तो अधिकर्षी भाइ-बहन चयनकर्ता (Adjacent sibling selector) का उपयोग कर सकते हैं。

उदाहरण में, यदि आप h1 एलीमेंट के बाद आने वाले पैराग्राफ की ऊपरी घाटी बढ़ाना चाहते हैं, तो इस तरीके से लिखें:

h1 + p {margin-top:50px;}

इस चयनकर्ता को यह तरीके से पढ़ा जाता है: “h1 एलीमेंट के बाद आने वाले पैराग्राफ को चुनें जो h1 एलीमेंट और p एलीमेंट को सामान्य पैरेंट एलीमेंट है”

अपने आप साबित करें

व्याकरण व्याख्या

अधिकर्षी भाइ-बहन चयनकर्ता का उपयोग करते हुए, जो जोड़न समान (Adjacent sibling combinator) है。

टिप्पणी:बच्चे संयोजक समान, अधिकर्षी भाइ-बहन संयोजक के पास खाली चिह्न हो सकता है。

नीचे दिए गए डॉक्युमेंट ट्री फ्रैगमेंट को देखें:

<div>
  <ul>
    <li>सूची आइटम 1</li>
    <li>सूची आइटम 2</li>
    <li>सूची आइटम 3</li>
  </ul>
  <ol>
    <li>सूची आइटम 1</li>
    <li>सूची आइटम 2</li>
    <li>सूची आइटम 3</li>
  </ol>
</div>

ऊपरी टुकड़े में, div एलिमेंट में दो सूची हैं: एक अनूप सूची और एक अनुक्रमित सूची, हर सूची में तीन सूची आइटम हैं।ये दो सूची अड्जैक्ट सिस्टर हैं, सूची आइटम भी अड्जैक्ट सिस्टर हैं।हालांकि, पहली सूची के सूची आइटम और दूसरी सूची के सूची आइटम अड्जैक्ट सिस्टर नहीं हैं, क्योंकि ये दो समूह सूची आइटम एक ही पैरेंट एलिमेंट के अधीन नहीं हैं (अधिकतम बहुसाथी भी नहीं है)।

याद रखें कि एक कोडनाटर केवल दो अड्जैक्ट सिस्टरों में दूसरे को चुनता है।नीचे का सेलेक्टर देखें:

li + li {font-weight:bold;}

ऊपरी इस सेलेक्टर से केवल सूची में दूसरी और तीसरी सूची आइटम को बोल्ड किया जाएगा।पहला सूची आइटम प्रभावित नहीं होगा。

अपने आप साबित करें

अन्य सेलेक्टरों से जोड़ा जा सकता है

अड्जैक्ट सिस्टर कोडनाटर अन्य कोडनाटरों से भी जोड़ा जा सकता है:

html > body table + ul {margin-top:20px;}

इस सेलेक्टर को यह बताया जाता है: एक टेबल एलिमेंट के बाद आने वाले सभी ब्रदर यूएल एलिमेंटों को चुना जाता है, जो एक बॉडी एलिमेंट में है, जो एचटीएमएल एलिमेंट का चाइल्ड है।