A CSS szintaxisa

A CSS szintaxis határozza meg, hogyan írunk szabályokat a HTML elemek stílusának beállításához. A szintaxis megértése elengedhetetlen a hatékony CSS használathoz.

Egy CSS szabály felépítése

Egy CSS szabály egy szelektorból és egy deklarációs blokkból áll. A deklaráció tulajdonságokat és azok értékeit tartalmazza, amelyek meghatározzák az elem stílusát.

Szelektorok a CSS-ben

A szelektorokkal választjuk ki, mely HTML elemekre alkalmazzuk a szabályokat. A leggyakoribbak az elem, az osztály (class) és az azonosító (id) szelektorok.

Elem szelektor

Az elem szelektor közvetlenül a HTML elem nevével hivatkozik, például minden <p> elemre.

Osztály (class) szelektor

Az osztály szelektor egy adott class attribútummal rendelkező elemekre vonatkozik, és mindig ponttal kezdődik.

Azonosító (id) szelektor

Az id szelektor egyedi azonosítóval rendelkező elemre vonatkozik, és mindig kettőskereszttel (#) kezdődik.

Több deklaráció egy szabályban

Egy CSS szabály több deklarációt is tartalmazhat, amelyek pontosan meghatározzák az elem megjelenését.

Which selector is recommended for styling multiple elements?

Selected: #id (1/3)

#id.classstyle

/* Choose the correct selector type */
#id {
  background-color: yellow;
}

Move the slider to set the value, then check your answer.

Tippek a CSS szintaxis használatához

A szintaxis helyes használata segít tiszta és könnyen karbantartható CSS kódot írni.

Mindig zárd pontosvesszővel a deklarációkat a hibák elkerülése érdekében.
Használj behúzást és sortörést az olvashatóság érdekében.
Válassz beszédes class neveket, hogy más fejlesztők is könnyen megértsék a kódot.