Nézzük alapozásnak miből áll egy html fálj. Csak a lényeg: Két részből áll, fej és törzs. (füle nincs, mint a vödörnek). A fejbe az egész dokumentumra (lapra) vonatkozó dolgokat lehet leírni, a törzsben van a tartalom. indítsunk el egy wysiwyg szerkesztőt és mentsünk egy üres lapot. Íme az üres váz forrása:
<html>
<head>
</head>
<body>
</body>
</html>Mi lehet a tartalomban:
- sima szöveg
- speciális karakterek
- formázás
- címsorok
- paragrafusok
- sortörés
- megjegyzés
- hivatkozások
- keretek
- táblázatok
- listák
- formok
- képek
- háttér meghatározás
- színek
A html formázások a teljesség igénye nékül csak a legfontosabbak:
<b>Bold=Félkövér</b> <i>Italic/nem olasz, hanem dölt betűs</i>
<u>UnderLine=Aláhúzott</u> <font color=szin>Szines betű, amiket már a CSS formázások korában már nem javaslom használni</font>
Címsorok: aki már wordben állított címsor x stílust, annak nem sokat kell magyarázni, mi ezeknek az előnye, pl lehet tartalkomjegyzéket készíteni. Nos html-ben más előnye van, amire később kitérek. A html-ben a <h1>Címsor 1</h1> -tól ... a <h6>Címsor 6</h6> lehetőségig használhatunk. Mindegyiknek van egy alapértelmezett formázása, melyet stílislapokkal meg lehet módosítani.
Paragrafusokat a <p> </p> tagokkal lehet létrehozni.
Ha egy szöveget új sorban akarunk kezdeni nem az enter billentyű a jó megoldás, mert aztnem veszi figyelembe a megjelenítésnél, hanem a <br /> tag. Itt láthatunk egy furcsa dolgot, mégpedig a > előtti / jelet. Ez az új szabvány szerint azt jelzi, hogy a tagnak nincs lezáró tagja, egymagában álló.
Megjegyzésbe tehetünk szövegrészeket, melyek nem jelennek meg:
<!-- Ez itt megjegyzés -->
A fő kérdés: hogyan helyezzünk el linkeket?
Az alap eset: <a href="http://honlapcime">Link szövege</a>
Lehetőség van még linket elhelyezni az oldalon belül.
A keretek, vagy frame-k régebben nagy divatnak örvendtek. Mára már a használatát senki sem javasolja. Az ingyenes tárhelyszolgáltatók a felső reklámokat szokták keretbe rakni.
A táblázatok: Itt egy minta:
<table> <!-- táblázat -->
<tr> <!-- sor eleje -->
<td></td> <!-- első cella-->
<td></td> <!-- második cella-->
</tr> <!-- sor vége -->
....
</table> <!-- táblázat vége -->
Régebben táblázatban oldottak meg design-elemeket, pl hasábok elrendezése, ami mára kezd kimenni a divatból.
Listák: számozatlan vagy számozott:
<ul>
<li>lista eleme</li>
<li>lista eleme</li>
</ul>
<ol>
<li>számozott elem</li>
<li>számozott elem</li>
</ol>
Formok: mindenféle bekérő mezők, ezeknek a kezelése szerintem túlmegy az alapokon.
Képek: <img src="kép elérési címe" alt="alternatív szöveg" /> Túl sok magyarázatra ez sem szorul (?). Az alternatív szöveghez egy kis magyarázat azért: Amíg a kép be nem töltődött, vagy nem tud betöltődni - pl le van tiltva, le lett törölve, karakteres a böngészőnk - addig ez a szöveg jelenik meg helyette. Valamint a keresők csak ez alapján tudják mi van a képen.
Kép mint háttér: Régen a weblap háttér megadással kimerült a háttér megadás lehetősége. A CSS formázással szinte mindennek lehet hátteret állítani, ami lehet átlátszótól, a szülő objektumtól örökölt háttéren át színes, vagy képes is. Bővebben majd a CSS részben...
Színek: A formázásoknál említettem, hogy lehet színezni is, akárcsak azt, hogy stíluslapokkal formázva szinezzünk inkább. Előljáróban annyit, hogy ez miért jó?
Ha nem tetszik a szinválasztás, könnyebb módosítani egy formázást leíró állományban, mint végignézni minden oldalt és egyenként javítani. A keresés/mindent cserél funkció nem jó, mert olyat is cserélhet amit nem szeretnénk.
Színeket hogyan adhatunk meg?
Az angol elnevezésükkel, vagy az RGB kódjukkal. Rengeteg van, úgyhogy csak néhány példa:
| Red | #FF0000 |
| Green | #008000 |
| Blue | #0000FF |
| Orange | #FFA500 |
Hamarosan következik a CSS rejtelmei...
