CSS de bază: Selectarea elementelor, ID-ului și Class

În CSS, puteți selecta elemente, class și id pentru a aplica stiluri și a personaliza elemente pe pagina dvs. web. Iată un ghid detaliat despre cum să le folosești:

 

Selectarea elementelor

Pentru a selecta toate instanțele unui anumit element HTML, utilizați numele elementului ca selector. De exemplu, p selectează toate <p> etichetele din document.

 

Selectarea Class

Pentru a selecta elemente cu aceeași clasă, utilizați un punct "." urmat de numele clasei. De exemplu, .my-class selectează toate elementele cu clasa my-class.

Pentru a selecta elemente cu mai multe clase, utilizați punctele "." și enumerați numele claselor separate prin spații. De exemplu, .class1.class2 selectează elemente cu ambele class1 și class2 clase.

 

Selectarea id

Pentru a selecta un anumit element după id, utilizați un simbol „#” urmat de elementul id. De exemplu, #my-id selectează elementul cu id my-id.

 

Combinarea Element, Class, și ID Selecții

Puteți combina class selecțiile de elemente,, și id pentru a viza anumite elemente cu anumite clase și ID.

De exemplu, div.my-class#my-id selectează <div> elementul cu class my-class  și ID my-id.

Iată un exemplu specific de selectare a elementelor, class și id în 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;  
}  

Folosind selecțiile element, class și ID, puteți selecta și stila cu ușurință anumite elemente sau grupuri de elemente de pe pagina dvs. web.