CSS एलीमेंट चयनक

CSS एलीमेंट चयनक

सबसे आम CSS सिलेक्टर एलीमेंट सिलेक्टर हैं। अन्य रूप से कहे तो, दस्तावेज़ के एलीमेंट ही सबसे बुनियादी सिलेक्टर हैं。

यदि आप HTML के स्टाइल को सेट करते हैं तो चयनकर्ता आमतौर पर किसी HTML एलीमेंट के लिए होता है, जैसे p, h1, em, a या यहीं से html के लिए भी हो सकता है:

html {color:black;}
h1 {color:blue;}
h2 {color:silver;}

स्वयं प्रयोग कीजिए

एक स्टाइल को एक एलीमेंट से दूसरे एलीमेंट पर ट्रांसफर किया जा सकता है。

अगर आप उपरोक्त पैराग्राफ (वहीं से h1 एलीमेंट नहीं) को ग्रे के रंग में सेट करना चाहते हैं। केवल h1 सिलेक्टर को p: करें

html {color:black;}
p {color:gray;}
h2 {color:silver;}

स्वयं प्रयोग कीजिए

टाइप सिलेक्टर

W3C मानकों में,एलीमेंट सिलेक्टर को टाइप सिलेक्टर (type selector) कहा जाता है。

“टाइप सिलेक्टर दस्तावेज़ भाषा एलीमेंट के नाम को मेल खाता है। टाइप सिलेक्टर दस्तावेज़ ट्री में इस एलीमेंट के प्रत्येक इंस्टेंस को मेल खाता है。”

नीचे के नियम दस्तावेज़ ट्री में सभी h1 एलीमेंटों को मेल खाते हैं:

h1 {font-family: sans-serif;}

तथापि,हम XML दस्तावेज़ के एलीमेंटों के लिए स्टाइल भी सेट कर सकते हैं:

XML दस्तावेज़:

<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/css" href="note.css"?>
<note>
<to>George</to>
<from>John</from>
<heading>याद दिलाना</heading>
<body>बैठक को न भूलें!</body>
</note>

CSS दस्तावेज़:

note
  {
  font-family:Verdana, Arial;
  margin-left:30px;
  }
to
  {
  font-size:28px;
  display: block;
  }
from
  {
  font-size:28px;
  display: block;
  }
heading
  {
  color: red;
  font-size:60px;
  display: block;
  }
body
  {
  color: blue;
  font-size:35px;
  display: block;
  }

प्रभाव देखें

उपरोक्त उदाहरणों से आप देख सकते हैं कि CSS एलीमेंट चयनक (टाइप चयनक) XML दस्तावेज़ के एलीमेंट के शैली को सेट कर सकता है。

अगर आप XML दस्तावेज़ में शैली जोड़ने के बारे में अधिक जानना चाहते हैं, तो कोडवैसी.कॉम के XML शिक्षण