Frontend jegyzetSearch...
\chapter{CSS}
CSS alapok
A következő fejezetben arról lesz szó, hogy hogyan tudnuk stíluslapokat készíteni a HTML oldalunkhoz. A fejezet végére képesek leszünk bonyolultabb elrendezéseket is megvalósítani.
Felhasználása HTML-ben
Jelenleg 3 lehetőségunk van arra, hogy megadjuk a megfelelő stílust az elemeinknek
Inline megadás
Ebbben az esetben a HTML tagünk kapni fog egy style attribútumot és ezen keresztül állítjuk a saját tulajdonságait.
HTML
<p style="color:blue;">...</p>
Internal
Ez a megoldás már jóval nagyobb szabadságot ad, ugyanis nem csak egy adott elemet tudunk állítani, hanem az egész oldalt. Viszont hátránya, hogy a HTML kódunk jelentősen meg tud nőni tőle és könnyen átláthatatlanná válik.
Itt amit alkalmazni fogunk az egy <style> tag lesz és ezek között helyezzük el a kódot.
HTML
<style>
p {
color: blue;
}
</style>
Különálló fájl
A legszebb és leggyakoribb megoldás, hogy a teljes stíluskészletünket egy külön fájlba mozgatjuk, így a HTML kódunk is áttekinthetőbb, valamint biztosak lehetünk benne, hogy az új fájlban csak a stlius található meg.
Ezeket a fájlokat .css kiterjesztéssel mentve fogjuk használni. És ahhoz, hogy a HTML-ben használni tudjuk, a <link> tagre lesz szükségünk, amelyet a <head>-ben fogunk mindig elhelyezni.
HTML
<link href="style.css" rel="stylesheet" />
Figyelem!
A rel="stylesheet" mindig szerepeljen a <link>-ben, ezzel fogja tudni a böngésző, hogy stíluslapként használja a megadott fájlt.
Box model
Szelektorok
Specificity
Ellenőrző kérdések
\pagebreak