- <head> es <body>
- Hala istennek lehet a dokumentumot reszekre osztani. Fej-tor-potroh. Hehe, hat majdnem igy. Tehat tudunk csinalni egy dokumentum fejreszt es egy testet. Altalaban a fejresz a dokumentum cimet tartalmazza, a test pedig az ami a fejbol kimaradt. Lassunk erre egy peldat:
<head>
</head>
<body>
Hello world
</body>
Ezt a fantaziadus (uresfeju) peldat akar meg is tekinthetjuk, hogy nemikepp letrejojjon bennunk a sok betuhoz egy kis vizualis latvany is. Mivel nem neveztuk el a dokumentumot (mert meg nem tudjuk hogy kell...), a kliensunk kedvesen megteszi ezt helyettunk. Mar latjuk is a Document Name mezoben feltuno UNTITLED szot. Na ezt csinaltuk. Meg neve sincs.
- <title>
- Mint mindent, a mi kis dokumentumunkat is el kell nevezni, vagy legalabb is ugy illik. A kovetkezokben adjunk nevet a gyereknek. Ezt a igy tehetjuk meg:
<head>
<title> Mr.Big Dummy's Page </title>
</head>
<body>
Hello world
</body>
Mint a fenti peldaban lathatjuk, mar van neve is a doksinknak. Errol ennyit.
- <p>
- Na ez vajon mi lehet ? P=paragraph. Ezzel lehet elvalasztani egymastol a paragraphokat. Ugyanis a HTML alapertelmezesben mindig un. justified kinezetet mutat, tehat faltol falig szedes, es szavankent tordel. De ha mi maskent akarunk tenni, (pl uj sorban kezdenenk akkor kell bevetni a <p>-t.
<head>
<title> Mr.Big Dummy's Page </title>
</head>
<body>
Hello world! Amit most irok az be lesz tordelve.
Hiaba utottem entert, a doksiban ez nem fog latszani,
mert a kliens alakitja a szoveget.
Akkor most legyen egy uj bekezdes.<p>
Mennyivel jobb egy uj sorban.
</body>
Ha most megnezzuk a peldat maris latjuk, hogy minden ugy van ahogy leirtam.
- <pre>
- Hurra, tudunk tordelni. De mi van akkor, ha egy projectrol irunk, ahol pl. egy c forraskodot akarunk megmutatni. A forras pedig ugy szep ahogy megirtak, azt nem kell tordelni. Erre talaltaki ki az okosok a <pre>-t. Azt jelentene, hogy elore formazott. Ilyenkor minden ugy irodik ki, ahogy az Isten megadta. A enter van, akkor enter. Ha a sor 3 km hosszu, akkor huzogathatjuk a kliens scrollbar-jat. Nezzunk 1 ilyet is:
<head>
<title> Mr.Big Dummy's Page </title>
</head>
<body>
Ez az en kis c programom, amit egyedul irtam:
<pre>
{
int i,j;
i=i++1;
j=j++-++i;
printf("A valasz %d. Mr.Dummy nagyon elit srac...\n",i);
}
</pre>
ugye milyen szep. Most viszont mar megint
proporcionalis betuvel irok.
</body>
Na ugye milyen szep kis c proggi. Most lassuk a formazott kepet.
- <br>
- Ez az un. forced linebreak. Tehat a kliens egybol uj sorba lep, de nem hagy ures sort mint a <p>-nel. Akkor jo, ha pl. valakinek a cimet akarom megadni, es proporcionalis betut ohajtok hasznalni. Mivel a <pre> fixed betut hasznal, az nem megoldas.
<head>
<title> Mr.Big Dummy's Page </title>
</head>
<body>
a cimem a kovetkezo:<br>
Mr.Big Dummy<br>
Tehenestotlak, Bika u. 66<br>
tel.: 931-45-23<br>
</body>
Mint latjuk tenyleg csak ott van sorveg, ahol mi akartuk. Nagyon egyhangu a szoveg... jo lenne a betumereten valtoztatni...
- <hx>
- Most megint koncentraciora lesz szukseg. A definicioban szereplo x az a kovetkezo halmaz barmelyike lehet [ 1, 2, 3, 4, 5, 6 ]. Magyarul ilyeneket irhatunk: <h1> <h2> stb. Igy kulonbozo meretu betuket kapunk. Nem magyarazkodom, lassuk a peldat:
<head>
<title> Mr.Big Dummy's Page </title>
</head>
<body>
<h1> Ez a legnagyobb </h1>
<h2> Ez mar kisebb, de meg tul nagy </h2>
<h3> No, ez mar jo megint. </h3>
<h4> Egyre kisebb...</h4>
<h5> Tyuha... </h5>
<h6> ... hol is a szemuvegem... </h6>
</body>
No, nezzuk csak meg ezt is formazva. Jo, mi ? Minden sor mas betumerettel. Ez mar dofi. De meg unalmas. Jo lenne feldobni 1-2 keppel...
- <img src="foo/dummy.gif">
- No, hat lehet itt mindent, meg inlined image-t is. Megpedig ugy, hogy a feni szoveg mintajara alkotunk egy dokumentumot, ahol a foo/dummy.gif-t egy letezo kepre, es eleresi utra csereljuk ki. De illo, hogy a kep letezzen es elerheto legyen, kulonben a helyen egy szep. broken image-t udvozolhetunk. A kep a sor eleme, ugyanugy mint a szavak. Tehat a kep melle, barmekkora is az, csak 1 sort irhatunk. De ezt lehet pozicionalni. Az img es az src koze kell egy align=akarmi-t beszurni. Na persze nem akarmi lehet, hanem: top, middle. Ha nem irnank semmit, akkor default, ami bottom. Itt nincs pelda, hanem csak az eredmenyt mutatom meg.
<img src="pic/dummy.gif">
<img align=middle src="pic/dummy.gif">
<img align=top src="pic/dummy.gif">
- <a href="prot://dummy.host.edu/foo/akarmi">ez itt egy hiperlink"</a>
- No, vegre elerkeztunk a hyper-hez. Ugyanis ez egy hyperlink.
Amit a < es a > kozott lánk, az az URL
(Uniform Resource Locator)
prot: a protokoll amin keresztul a kapcsolat letrejon. Ha a site, amire a link mutat ftp-server, akkor azt ertelemszeruen ftp-vel kell elerni. Lehetseges esetek: http, gopher, ftp, wais, news, telnet, file.
dummy.host.edu: A host neve, ahova a link mutat.
foo/: Az eleresi utvonal (path).
akarmi: Na ez tenyleg akarmi lehet. lehet kep, hang, szoveg, animacio, futtathato proggi...
ez itt egy hiperlink: ez jelenik meg a kepernyon kiemelve (altalaban kekkel), ha erre klikkelunk, akkor az lozoleg megadott cimen talahato valamit kapjuk meg.
- <HR>
- Azt hiszem, ez a legkedvesebb utasitasom. Leirni is egyszeru. Ezt csinaja:
- Listak... <ul>, <ol>, <li>:
- Nosza, csinaljunk listakat. De hogy ? Egyszerulen. A <ul> a legegyszerubb lista. az UL rovidites, azt jelenti unordered list. Az <ol> pedig az ordered list roviditese. Az ordered listaval szamozott listat keszithetunk, ahol minden listaelem <li> egy szamot kap, mig az unordered listanal a lista elemei egyenranguak, nem sorszamozottak, hanem egy kis pottyot (vagy a lista szintjetol fuggo ikont) kapnak. Ime 1 pelda:
<head>
<title> Mr.Big Dummy's Page </title>
</head>
<body>
<ul>
<li> ime 1 listaelem.
<li> itt meg egy masik..
<ul>
<li> de lehet tobbszintu felsorolast is csinalni.
<li> ugy biza...
</ul>
<li> sot, lehetseges a 2 felsorolastipus kombinacioja is...
<ol>
<li> huuhhh, huuh.. hey Beavis, pull my finger...
<li> uhmm... no way, man
<li> huuuh, huuh...
</ol>
</ul>
</body>
Nos, mint lattuk, sok erdekes dolgot keverhetunk ki a listaink segitsegevel. De ez meg nem minden, de nem am...
- A definiciolista:
- Itt az egyszeruseg kedveert csak a parancsok jelenteset irom le, a hasznalatuk a peldabol egyertelmuen megertheto lesz.
- <dl>: definiciolista kezdete
- <dt>: definicio megnevezese
- <dd>: a definicio hosszabb leirasa.
- mig vegul a deviniciolista lezarasa a </dl>.
<head>
<title> Mr.Big Dummy's Page </title>
</head>
<body>
<dl>
<dt> boltzmann-allando:
<dd> Minden valtozik, csak a boltzmann allando. Jo szoveg,
csak zizzenesem sincs az egeszhez, pedig szerdan vizsgazom.
Remelem azert megtiprom a belast magamnak.
<dt> a lamer:
<dd> Konnyen felismerheto, hiszen neki van az udvarban/hazban
/varosban a legklasszab gepe, hexium 2100 999Mhz-es procival,
100-szoros sebessegu cd iro-olvaso-torlovel, es SoundBlasterPro128
hangkartyaval, ami mar termonuklearis raketakilovot is tud
vezerelni... (guru;)
</dl>
</body>
Na, ez volt a pelda. Ha pedig ide klikkelsz, akkor meglathatod formazott alakban is.
- Stilusok:
- Sok stilus van, azazhogy keves. Megpedig 3. A bold, italic es a fixed. A bold jele a <b>, az italic-e a <i> a fixed stiluse pedig a <tt>. Ezek a fizikai stilusok. A logikai stilusokat lasd az NCSA Beginners Guide 2 HTML-ban.
Na kedves kozonsegunk, ennyi. That's all, folx. No persze ez nem minden. Van meg sok egyeb jeloles, amit egy igazi html-es srac tud. En csak egy inditotudast akartam atadni a kedves erdeklodonek - remelem sikerult. Aki tobbet akar tudni, az olvassa el az 