Pagrindinis CSS: elementų pasirinkimas, ID ir Class

CSS galite pasirinkti elementus, class, ir id pritaikyti stilius bei tinkinti elementus savo tinklalapyje. Čia yra išsamus jų naudojimo vadovas:

 

Elementų pasirinkimas

Norėdami pasirinkti visus konkretaus HTML elemento egzempliorius, kaip parinkiklį naudokite elemento pavadinimą. Pavyzdžiui, p pažymi visas <p> žymas dokumente.

 

Pasirinkimas Class

Norėdami pasirinkti elementus su ta pačia klase, naudokite tašką "." po kurio nurodomas klasės pavadinimas. Pavyzdžiui, .my-class pasirenka visus elementus su klase my-class.

Norėdami pasirinkti elementus su keliomis klasėmis, naudokite taškus "." ir surašykite klasių pavadinimus, atskirtus tarpais. Pavyzdžiui, .class1.class2 pasirenka elementus su abiem class1 ir class2 klasėmis.

 

Pasirinkimas id

Norėdami pasirinkti konkretų elementą pagal jo id, naudokite maišą „#“, po kurio seka elemento id. Pavyzdžiui, #my-id pasirenka elementą su id my-id.

 

Element, Class, ir ID pasirinkimų derinimas

Galite derinti elemento, class, ir id pasirinkimus, kad nukreiptumėte į konkrečius elementus su konkrečiomis klasėmis ir ID.

Pavyzdžiui, div.my-class#my-id pasirenka <div> elementą su class my-class  ir ID my-id.

class Čia yra konkretus elementų ir id CSS pasirinkimo pavyzdys:

/* 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;  
}  

Naudodami element, class, ir id pasirinkimus, galite lengvai pasirinkti konkrečius elementus arba elementų grupes savo tinklalapyje ir sukurti jų stilių.