Css útmutató

A CSS-nek egy dokumentumhoz történő csatlakoztatásának módja

  • Ha a stíluslapot maga a dokumentum írja le, akkor a címkén belül helyezhető el (amely viszont a címkék között található ebben a dokumentumban és ). A táblázat minden szabálya érvényes az egész dokumentumban;
  • ha a stíluslapot maga a dokumentum írja le, akkor elhelyezhető benne egy adott címke (a stílus-attribútumán keresztül) ebben a dokumentumban. A táblázatban szereplő összes szabály csak a címke tartalmára vonatkozik.

Az első két esetben azt mondják, hogy külső dokumentumlapokat alkalmaznak a dokumentumra. és a második két esetben - belső stíluslapok.

Ha CSS-t szeretne hozzáadni egy XML dokumentumhoz, az utóbbinak tartalmaznia kell egy speciális hivatkozást a stíluslapra. Például:

Elemek hierarchiája egy dokumentumon belül

Mint tudják, a HTML-dokumentumok az elemek hierarchiája alapján épülnek fel, amelyek vizuálisan megjeleníthetők egy faszerű formában. A HTML elemek egymáshoz lehetnek szülő, gyermek, őse, leszármazottja, nővére.

Egy elem egy másik elem szülője, ha közvetlenül a dokumentum hierarchikus felépítésében közvetlenül az elem fölött van. Egy elem egy másik elem őse, ha a dokumentum hierarchikus felépítésében valahol ezen elem fölött van.
Legyen például a dokumentumban két bekezdés, p. beleértve a vastag betűtípust b. Ezután a b elemei a szülőelemük gyermekei. és az őseik leszármazottai. Másrészt a p elemeknél a testelem csak a szülő lesz. Ezenkívül ez a két elem p testvér elemek. mint ugyanaz a szülő teste.

A CSS lehet meghatározni révén a szelektor, nem csak egyetlen elem, de olyan elemeket, amelyek utódai, vagy szoptatott csecsemőnél elemek egyéb elemeket (lásd. Alszakasz „féle szelektor”).

CSS szabály létrehozása

A szelektor típusai

A CSS szabályválasztók lehetnek

  • A CSS-ben is van egy úgynevezett univerzális választó. Ez azt jelenti, hogy a dokumentumban megtalálható bármely elem. Például *. Mielőtt bármely olyan választó, amely egy osztályt vagy azonosítót határoz meg, egy univerzális választó karaktert helyezhet el, ami például egyenértékű kifejezést eredményez. az elsőnek és a *. elsőnek ugyanaz a jelentése.

Elemek osztályai. Tételazonosító.

Egy osztály vagy azonosító hozzárendelhető bármely HTML elemhez (címke) az elem (címke) osztály- vagy id attribútumait használva:

Az elemosztályok és az elemazonosítók közötti fõ különbség az, hogy egy dokumentumban egy osztály egyszerre több elemhez rendelhetõ, és egy azonosító csak egy elemhez rendelhetõ. A különbség az is, hogy több osztály létezhet (amikor az elemosztály több szóból álló szóból áll). Az azonosítók esetében ez nem lehetséges.

Az osztályok és az azonosítók nevei, ellentétben a címkék nevével és tulajdonságaival, érzékenyek a levelek nyilvántartására.

Az osztályok és azonosítók tulajdonságait a megfelelő szelektorok segítségével határozzák meg. És lehet meghatározni, mint egy ingatlan az osztály egésze (ebben az esetben a választó kezdődik „”), illetve az azonosító maga a tulajdonság (ebben az esetben a választó kezdődik egy »#«), és tulajdonságai ennek az osztálynak olyan elem vagy ez az azonosító.

Örökséget. Lépcsőzetes. A CSS stílusainak prioritásai.

A CSS HTML dokumentumokra történő alkalmazása az öröklés és a kaszkád elvein alapul. öröklési elv az, hogy a CSS tulajdonságokat nyilvánítanak az ős elemek öröklik az utódok az elemek. De, persze, nem minden CSS tulajdonságok öröklődnek - például, ha a CSS p paragrafus jelenti adott keret, akkor nem örökölheti bármely tag a jelen tag p, de ha a bekezdés p CSS eszköz az betűszíne (pl , szín: zöld;), akkor ezt a tulajdonságot a bekezdésben szereplő összes tag elem fogja örökölni.

A kaszkád elvét akkor használjuk, amikor egy HTML elemnek egyszerre több CSS-szabálya van, azaz amikor ezeknek a szabályoknak az értékei ütköznek. Az ilyen konfliktusok megoldásához elsőbbségi szabályokat ad meg.

Stíluslap példa

Példa egy stíluslapra (ebben a formában elhelyezhető egy különálló .css fájlban, vagy címkékkel van ellátva