9. lecke - stílusok még egyszer

Szövegek szépítése CSS stílusokkal (css1 - 4.html)

Hajtsuk végre pontosan a következő utasítássort:

másoljuk a böngésző címmezejébe:
http://www.brody-ajka.sulinet.hu/brody/PGS/pages/evkonyv2003/index2.php?mp=f4#6e
töltsük be újra a vaz.html fájlt
illesszük a törzsbe a "A 6 évfolyamos gimnáziumról" szöveggel kezdődő kb. 12 bekezdést
töröljük ki a felesleges részt (a táblázat sem kell)
mentsük félkész oldalunkat css1.html néven

Nézzük meg a böngészőben! Elég ronda szegény!

Az első bekezdés címsor1 (h1) legyen, a többi egyszerű bekezdés (p) !

	<h1>A 6 évfolyamos gimnáziumról</h1>
	<p>A hat évfolyamos ... </p>
	...
	<p>Az elmúlt évek ... </p>
	<p>Burján Károlyné</p>

Nézzük meg újra!

Illesszünk a body mögé stílusokat, így az egész lap jellemzőit/tulajdonságait állítjuk be.

margin

	<body style='margin-left:250px;margin-right:250px;'>

A style stílust jelent magyarul. A margin-left (bal margó) illetve a margin-right (jobb margó) a weblap bal illetve jobb oldalán állítanak be 250 pixelnyi margót. Használható még a margin-top (felső margó) és a margin-bottom (alsó margó) is.

Az egyes stílusjellemzőket pontosvesszővel zárjuk le!

Nézzük meg a böngészővel! Módosítsuk a margók értékét, próbáljuk ki a felső margót is!

Módosítsuk két bekezdés bal margóját is: a "Miután az idegen ..." kezdetűét (helyet hagyunk a képnek) és a legutolsó bekezdését (ez dőlt is)!

	<p style='margin-left:450px;'> Miután az idegen ... </p>
	<p style='margin-left:600px;'> <i>Burján Károlyné</i> </p>

Mentsük javított oldalunkat css2.html néven és nézzük meg!

font-family, font-size, text-align

Egészítsük ki a body mögötti stílusokat:

	...; font-family:Verdana;font-size:13px;text-align:justify;'>

Magyarázat:
font-family:Verdana; - a betű család Verdana (lehetne Arial, Times New Roman, stb.)
font-size:13px; - betűméret 13px
text-align:justify; - a sorok igazítása sorkizárt (lehetne right-jobbra, left-balra vagy center-középre is)

Mentsük oldalunkat css3.html!

Nézzük meg így is böngészővel! Változtassuk a tulajdonságokat!

Most a cím jellemzőit finomítsuk. A <h1> miatt eleve nagyobb betűkkel, félkövéren jelenik meg.

color

	<h1 style='font-family:Times;text-align:center;color:green;'>

Most csak a color (szín) az ismeretlen, utána írható a szöveg színe angolul (green-zöld, blue-kék, yellow-sárga, red-vörös, white-fehér, black-fekete, brown-barna, stb.)

Mentsük javított oldalunkat css4.html néven! Nézzük meg így is a böngészővel!