|
| |
A stíluslap | A stílusfájl megkönnyíti a weblapkészítő dolgát, ugyanis ennek segítségével sokkal kevesebb kódot kell bepötyögtetni, bizonyos formázási elemeket egyszerű módszerrel alkalmazhatunk a honlapunkon.
Pédául, ha több helyen mindig középre rendezett nagy kék betűkkel szeretnénk írni, akkor a hagyományos módszerrel, hosszú kódsorozatot kell megadnunk minden ilyen sor esetében.
A css stílusfájl használatával csupán a szöveg előtt kell hivatkoznunk az előre beállított tulajdonságokra.
A stílusfájlt is lehet sima jegyzettömbbe szerkeszteni, mentéskor pl. ilyen nevet lehet adni neki: stilus.css (tehát a kiterjesztés css, majd a "minden fájl" opciót kell választani, ANSI kódolással.) Ezt a fájlt abba a mappába érdemes menteni, ahol a honlapon dolgozunk - a fejlécben a </head> ELŐTT kell behívni ezzel a sorral:
<link href="stilus.css" type="text/css" rel="stylesheet" />
Stílusfájl készítése - alapok
- Beállíthatjuk az egész weboldal alap-megjelenését, használatos betűtípusát, betűméretét, betű-színét, háttérszínt, háttérképet, ...stb. - kb. 5-8 sorban. Ezek a beállítások az egész honlapra érvényes hatással vannak.
- És vannak a főcímek, a kiemelt szövegrészek, táblázat fejlécek,... stb. amelyek akkor a legszebbek, ha azokat mindig egységesen jelenítjük meg. Ezeket az elemeket külön definiáljuk - s csak az alapbeállítástól eltérő helyeken hivatkozunk rájuk: Pl. minden oldal főcíme előtt... (Mint itt a tanfolyami részben is a "Stíluslap" feliratnál)
- A stíluslappal eleve tagolhatjuk a honlapot is - kisebb egységeket alkotunk, és azokra alkalmazunk egyedi beállításokat, amik csak arra az adott egységre vonatkoznak. (pl. a menü megjelenítése - itt nálam is sötét alapon fehér betűk és linkek, a belső szövegmezőben pedig más beállítás szerint)
- Ezek a fő- és alapbeállítások az összes aloldalra is hatással vannak, ezért rendkívül hasznos alkalmazni a stílusfájlt. Érdemes megismerkedni vele már a HTML tanulással egy időben, és, ha lehet, akkor azonnal használni is - hiszen a későbbiek folyamán úgyis mindenki áttér az "egyszerűbb" módszerre:-)
Alkalmazás
A hosszú kódsorozat helyett - példaképpen - így hivatkozunk:<div class="nagykek"> Ide jön az a kiemelt szövegrész, vagy címmező </div>
.... a lecke kidolgozása folyamatban van....
|
|
KATAPORTA - HONLAPKÉSZÍTÉS, WEBDESIGN, WEBHOSTING
0670 261 2135
kata@kataporta.net |
| |
| |
