इस आर्टिकल में CSS के Selectors के बारे में आप लोगो को पूरी तरह से सिखाया जायेगा , और साथ में Practical में भी करके दिखाया जायेगा , ताकि इस Concept को लेकर आपके मन के कोई भी Doubt न रहे | और इस आर्टिकल के बाद आप लोग खुद ही इस Selectors को अपने HTML के Code के अन्दर आसानी से Implement कर पयोगे | तो चलिए शुरू करते हे What is Selectors in CSS in Hindi ........
What is Selectors in CSS in Hindi - सिलेक्टर क्या है ?
जब हम किसी एक निर्दिष्ट HTML Tag में Style करना चाहते हे , या फिर एक से जादा HTML Tag या Element के अन्दर Style करना चाहते हे तो , उस Time हमें CSS के Selectors को Use करना पड़ता हे , मतलब Selectors के मदत से ही HTML Tag या Element के अन्दर Style किया जाता हे | ( जैसे Color Change करना , Font Size छोटा या बड़ा करना ) जिसके बजह से Web Page Attractive लगता हे जो दिखने में काफी सुन्दर लगता हे | जेइसे HTML के Code में h2 नाम से एक Tag हे , तो इस h2 के Tag को हम CSS के Selectors के मदत से इस h2 के अन्दर जो भी Text होगा उसमे Style कर सकते हे , जेइसे Text को Color करना या Bold करना , कुछ इस तरह से Style किया जाता हे | कहने का मतलब हे CSS Selectors के मदत से ही आप Web Page में किसि भी Text या फिर लाइन को आसानी से Style कर सकते हो | तो आप लोग ये तो समझ ही गये होंगे की CSS Selectors क्या होता हे , और किस तरह से Web Page में काम करता हे |
Types of CSS Selectors :-
CSS के अन्दर बहत सारे Selectors को Use किया जाता हे हे , जिनमे से जो Basic Selectors होते हे , जिसे जानना बहत जरुरी हे उन सारे Selectors के बारे में इस आर्टिकल में बात करेंगे , और जो बाकि Selectors होंगे वो सब जब आप Practical में करेंगे तो अपने आप जान जायोगे | तो CSS Selectors Basically 5 तरह के होते हे |जेइसे ,,,,
- Element Selectors
- Id Selectors
- Class Selectors
- Universal Selectors
- Grouping Selectors
1. What is Element Selectors in CSS:-
इस Element Selectors के मदत से किसी Direct Element को Target करके Style किया जाता हे , और किसि भी Element के Properties को आसानी से Change किया जाता हे |जेइसे -
h1 {
color : blue;
text-align: center;
}
जिस तरह हमने इस h1 को टारगेट करते हुए इस h1 को आसानी से Style कर सकते हे | तो इस Code के मदत से जितने h1 होंगे वो सब के Color Blue और Text Center में हो जायेगा | तो इस तरह से Element Selectors को Use किया जाता हे | एक Element को Target करके उसी नाम पे जितने सारे Element होंगे वो सब अपने आप Style हो जायेगा | अब चोलो एक Program करके देखते हे , ताकि इस Concept को और अछे से समझ पाओ |
तो देखा किस तरह से Element Selectors को अपने Coding के अन्दर Use किया जाता हे |
2. What is Id Selectors in CSS :-
जिस तरह Element Selectors में हम किसी भी Element को Style कर सकते थे , लेकिन इस Id Selectors में Attributes को और किसी Particular Element को Style किया जाता हे | और ये Id Selectors एक Unique Selectors होता हे , जिस Id को एकबार Use करोगे अपने HTML के Code में तो फिर उसी नाम से आप दूसरा Id नही Use कर पयोगे | मतलब एक ही नाम से आप अलग अलग Id को Create नही कर सकते हो | पुरे HTML Coding के अन्दर जो भी Id Selectors को Use किया जायेगा वो Unique होना चाहिए , जिसके बजह से उसी Id को Target करके Style किया जा सके | और इसके लिए Id Selectors में एक Symbol को Use किया जाता हे , जिसके बजह से Id को पहचाना जाता हे , वो Symbol हे ( # ) | अगर किसि Character के आगे ये # Add कर दिए तो वो Id Selectors हो गेये |जेइसे -
#num
{
color : red;
text align : center ;
}
तो इस तरह से किसि भी Character के आगे # करने से ही वो Id Selectors हो जायेगा , लेकिन वो Character Unique होना चाहिए , जेइसे हमने # नामपे एक Id Selectors को लिया , तो हम फिरसे कही पे भी इस #num से एक और Id को Use नेहि कर सकते हे |
आशा करता हु की आप लोग समझ गये होंगे जो में समझाने की कौसिस कर रहा हु |
Class Selectors के मदत से किसी भी Particular Element या फिर Attributes को Target करने के बाद उसी Element को Style किया जाता हे | जिस तरह Id Selectors का एक Symbol होता हे , उसीतरह इस Class Selectors का भी एक Symbol होता हे जिस बजह से इस Class Selectors को आसानी से पहचाना जाता हे | और HTML के Code के अन्दर इस Class Selectors को Dot (.) Symbol के साथ Use किया जाता हे | और ये Class Selectors एक HTML Coding में एक से जादा भी Use किया जाता हे , वो आपके ऊपर Depend होता हे |
मतलब आपने Web Page में हम Multiple Class Selectors को Use कर सकते हे |
जेइसे -
.sanat
{
color: orange red ;
text align : center ;
}
तो कुछ इस तरह से Class Selectors को Use किया जाता हे | आइये एक Program के साथ इसको समझने की कौसिस करते हे |
मतलब आपने Web Page में हम Multiple Class Selectors को Use कर सकते हे |
जेइसे -
.sanat
{
color: orange red ;
text align : center ;
}
तो कुछ इस तरह से Class Selectors को Use किया जाता हे | आइये एक Program के साथ इसको समझने की कौसिस करते हे |
4. What is Universal Selectors in CSS :-
Universal Selectors एक एइसा Selectors हे जिसके निचे और भी कई Element या फिर Tags काम करता हे | जेइसे - मानलो एक Father हे और उसके दो Child हे , तो अगर उस Child में कोई भी Style करना चाहे तो वो Direct Father Element में Style करे तो वो Child Element में अपने आप Style हो जायेगा | मतलब इस Universal Selectors के मदत से एक से जादा Element या फिर Attributes को एक साथ Style किया जा सकता हे | और ये Universal Selectors को ( * ) Symbol से पहचाना जाता हे |जेइसे - हमने इस Universal Selectors को Practical में करके समझाने की कौसिस की हे |
तो देखा आप लोगोने ये Universal Selectors कैसे काम करता हे अपने HTML Coding के अन्दर |
5. What is Grouping Selectors in CSS :-
जब HTML के Coding के अन्दर Tags अलग अलग हे , लेकिन उन Tags या Element में Rules एक ही हे , तो उस Case में इस Grouping Selectors को Use किया जाता हे | मतलब-h1
{
background-color : red;
color: white;
}
h2
{
background-color : red;
color: white;
}
p
{
background-color : red;
color: white;
}
देखो इन सारे Selectors के अन्दर एक ही काम को करने को बोला गया हे ,फिर भी हमने अलग अलग Selectors को Use किया हे , तो जब इस तरह के काम को किया जाता हे , तो फिर उसमे इस Grouping Selectors को ही Use किया जाता हे | जेइसे -
h1,h2,p
{
background-color : red;
color: white;
}
तो इन Grouping Selectors के मदत से ही इन सारे Tags या Element के अन्दर ये Style Set हो जायेगा | उम्मीद करता हु की इस Concept को आप लोग समझ गये होंगे | एक उदाहरण के साथ इस Selectors को और अछे से समझाने की कौसिस करते हे ,,,,,
तो कुछ इस तरह से CSS के अन्दर Selectors को Use करके अपने Web Page के अन्दर Style या फीर Design किया जाता हे |
Read More : CSS in Hindi
Conclusion :-
हमने आज (What is Selectors in CSS in Hindi ) इस आर्टिकल में CSS के Selectors के बारे में पूरी जानकारी देने की कौसिस की हे | Selectors के मदत से ही Web Page के अन्दर अछे से Design किया जाता हे | Selectors के बजह से HTML के Coding में से किसी भी Element या Tags को Target करके Design कर सकते हो | उम्मीद करता हु इस जानकारी आप लोगो को पसंद आया होगा | अगर कोई भी Doubt या फिर कोई शाबाल हे इस आर्टिकल को लेकर तो आप निचे कमेंट करके पूछ सकते हो |इस पोस्ट को पूरा पड़ने के लिए धन्यवाद |