Simple selectors

In our first selectors article we'll learn about "simple" selectors, so-called because they directly match one or more elements of a document, based on the type of element (or its class or id.)

Type selectors aka element selectorsEDIT

This selector is just a case-insensitive match between the selector name and a given HTML element name. This is the simplest way to target all elements of a given type. Let's take a look at an example:

हमारे पहले चयनकर्ता लेख में हम "सरल" चयनकर्ताओं के बारे में सीखेंगे, तथाकथित क्योंकि वे सीधे तत्व के प्रकार (या इसकी कक्षा या आईडी) के आधार पर एक दस्तावेज़ के एक या एक से अधिक तत्वों से मेल खाते हैं।

चयनकर्ताओं को उर्फ ​​तत्व चयनकर्ता लिखें
यह चयनकर्ता केवल चयनकर्ता नाम और दिए गए HTML तत्व नाम के बीच एक केस-असंवेदनशील मैच है। किसी दिए गए प्रकार के सभी तत्वों को लक्षित करने का यह सबसे सरल तरीका है। आइए एक उदाहरण पर एक नज़र डालें:

यहां कुछ HTML है:

<p>What color do you like?</p>
<div>I like blue.</div>
<p>I prefer red!</p>

A simple style sheet:

/* All p elements are red */
p {
  color: red;
}

/* All div elements are blue */
div {
  color: blue;
}

Active learning: Selecting different elementsEDIT

For this active learning, we'd like you to try changing the selector on the single CSS rule so that different elements in the example are styled. Do you know how to write a selector to apply the ruleset to multiple elements at once?

If you make a mistake, you can always reset it using the Reset button. If you get really stuck, press the Show solution button to see a potential answer.

सक्रिय सीखना: विभिन्न तत्वों का चयन करना
इस सक्रिय शिक्षा के लिए, हम चाहते हैं कि आप सिंगल सीएसएस नियम पर चयनकर्ता को बदलने का प्रयास करें ताकि उदाहरण के विभिन्न तत्वों को स्टाइल किया जाए। क्या आप जानते हैं कि एक बार में कई तत्वों को नियम-पत्र लागू करने के लिए एक चयनकर्ता कैसे लिख सकता है?

यदि आप कोई गलती करते हैं, तो आप रीसेट बटन का उपयोग करके इसे हमेशा रीसेट कर सकते हैं। यदि आप वास्तव में अटक जाते हैं, संभावित उत्तर देखने के लिए समाधान दिखाएँ बटन दबाएं।