- A Cascading Style Sheet (Egymásba ágyazott stíluslapok) rövidítéséből származik a CSS.
- HTML dokumentumok formázása a célja.
- A címkéhez közelebb levő formázást alkalmazza a böngésző – a gyakorlatok során kipróbáljuk.
Új HTML címkék ebben a leckében:
<style></style> - a HTML dokumentum fejlécében ezzel a címkével szükséges közrezárni az esetleges formázásokat, amelyeket az adott dokumentumra meg szeretnénk adni.
<link> </link> - a HTML dokumentum fejlécében ezzel a címkével adhatunk meg hivatkozást külső CSS fájlokra. Ezt a címkét használtuk az ikon beszúrására a böngésző címsorába.
Új HTML tulajdonság ebben a leckében:
style – bármely HTML címkét kiegészíthetjük ezzel a tulajdonsággal (attribútummal) és így a címkén belül is megadhatunk CSS formázást.
color – egy szövegrész betűszínét állíthatjuk ezzel a tulajdonsággal.
Példák:
A fenti példában egy címet színezünk pirosra. A style tulajdonságot használjuk a <h1> címkében.
Ez belső stílus, amely kizárólag erre a címre vonatkozik.
A color:red; részben a color a CSS tulajdonság, a red (piros) az értéke.
A fenti példában a stílust a HTML dokumentum fejlécében van megadva. Így nemcsak egy címre, hanem a dokumentumon belül minden <h1> címke tartalmára hatással van.
Itt pluszba bekerül a <style> címke a <head> részbe és a h1 szelektor adja meg, hogy a zárójelekkel közbezárt formázások az egyes szintű címekre vonatkoznak.
A fenti példában a CSS leírás kikerül a HTML dokumentum tartalmából egy css kiterjesztésű fájlba. Ehhez létre hoztunk egy külön fájlt a stílusnak, a <link> címke alkalmas a stíluslap megadására. Így nem csak egy HTML dokumentum tartalmára vonatkozhat ez a formázás, hanem bármelyikre, amely hivatkozik rá.
In the style.css: p { color: red; }
In the index.html:
...
HTML part:
