मूलभूत CSS: घटक, आयडी आणि निवडणे Class

CSS मध्ये, तुम्ही घटक निवडू शकता, class आणि id शैली लागू करण्यासाठी आणि तुमच्या वेब पेजवर घटक सानुकूलित करू शकता. ते कसे वापरावे याबद्दल तपशीलवार मार्गदर्शक येथे आहे:

 

घटक निवडत आहे

विशिष्ट HTML घटकाची सर्व उदाहरणे निवडण्यासाठी, घटकाचे नाव निवडकर्ता म्हणून वापरा. उदाहरणार्थ, दस्तऐवजातील p सर्व टॅग निवडते. <p>

 

निवडत आहे Class

समान वर्गातील घटक निवडण्यासाठी, "" बिंदू वापरा. त्यानंतर वर्गाचे नाव. उदाहरणार्थ, .my-class वर्गासह सर्व घटक निवडते my-class.

एकाधिक वर्गांसह घटक निवडण्यासाठी, बिंदू वापरा "." आणि रिक्त स्थानांद्वारे विभक्त केलेल्या वर्गाच्या नावांची यादी करा. उदाहरणार्थ, .class1.class2 दोन्ही class1 आणि class2 वर्गांसह घटक निवडते.

 

निवडत आहे id

विशिष्ट घटक त्याच्या द्वारे निवडण्यासाठी id, घटकाच्या नंतर हॅश "#" वापरा id. उदाहरणार्थ, #my-id सह घटक निवडते id my-id.

 

Element, Class, आणि ID निवडी एकत्र करणे

class विशिष्ट वर्ग ID आणि .

उदाहरणार्थ,  आणि सह घटक div.my-class#my-id निवडते. <div> class my-class ID my-id

येथे घटक निवडण्याचे विशिष्ट उदाहरण आहे, class आणि id CSS मध्ये:

/* Select all <p> tags */  
p {  
  color: blue;  
}  
  
/* Select elements with the class "my-class" */  
.my-class {  
  background-color: yellow;  
}  
  
/* Select the element with the ID "my-id" */  
#my-id {  
  font-weight: bold;  
}  
  
/* Combine element, class, and ID selections */  
div.my-class#my-id {  
  border: 1px solid black;  
}  

element, , आणि आयडी निवडी वापरून class, तुम्ही तुमच्या वेब पृष्ठावरील विशिष्ट घटक किंवा घटकांचे गट सहजपणे निवडू शकता आणि शैली करू शकता.