Hogyan készítsünk saját honlapot a Weben?

Elôzô fejezet | Tartalom | Következô fejezet

Függelék

HTML leírók

A lapszerkezet

<html> ... </html> A lap HTML része. (Általában az elsô sortól az utolsóig.)
<head> ... </head> Fejlécinformációk.
<body> ... </body> A lap törzse.
- background=(file|url) Háttérkép.
- bgcolor=XXXXXX Háttérszín.
- text=XXXXXX Szövegszín.
- link=XXXXXX Meg nem nézett link színe.
- vlink=XXXXXX Megnézett link színe.
- alink=XXXXXX Épp most kiválasztott link színe.
 Megjegyzés.

Keretek

<frameset> ... </frameset> Keretleírás.
- rows="p1,p2,...,*" Osztás vízszintes vonallal a megadott pixel(ek)nél.
- cols="p1,p2,...,*" Osztás függôleges vonallal a megadott pixel(ek)nél.
<frame> Ablak a kereten belül.
- src=(file|url) A lap forrása.
- name=(file|url) Az ablak neve.
- marginheight=[pixel] A margó magassága.
- marginwidth=[pixel] A margó szélessége.
- scrolling=(yes|no|auto) Az ablak görgethetô (mindig|soha|ha nagy).
- noresize Az ablak nem méretezhetô át.
<noframes> ... </noframes> Kereteket nem kezelô böngészôknek szóló rész.

Fejlécelemek

<title> ... </title> A fejlécben megjelenô szöveg.

Címsorok

<h1> ... </h1> Cím. További címjelek: h2, h3, h4, h5, h6.
- align=(left|center|right) Elhelyezés.

Elhatárolók

<p> ... </p> Bekezdés.
- align=(left|center|right) Elhelyezés.
<br> Sordobás.
<nobr> ... </nobr> Nem engedi megtörni a sort a lap szélén.
<wbr> ... </wbr> A szöveg újsor karakterei hatásosak.
<hr> Határolóvonal.
- size=[pixel] Vastagság.
- align=(left|right|center) Elhelyezés.
- width=([pixel]|[%]) Hossz.

Táblázatok

<table> ... </table> A táblázat.
- border=[pixel] Keretszélesség.
- width=([pixel]|[%]) Táblázatszélesség.
<caption> ... </caption> Táblajegyzet.
- align=(left|right|center) Elhelyezés.
<tr> ... </tr> Sorváltás a táblázatban.
- align=(left|right|center) Elhelyezés.
- valign=(top|middle|bottom|baseline) Elhelyezés cellán belül.
<th> ... </th> Oszlopváltás a táblázatban kiemelt szöveggel.
- align=(left|right|center) Elhelyezés.
- valign=(top|middle|bottom|baseline) Elhelyezés cellán belül.
- nowrap Nem engedi a tördelést.
- colspan=[columns] Több oszlopnyi széles bejegyzés.
- rowspan=[rows] Több sornyi hosszú bejegyzés.
- width=([pixel]|[%]) Cellaszélesség.
<td> ... </td> Oszlopváltás a táblázatban.
- align=(left|right|center) Elhelyezés.
- valign=(top|middle|bottom|baseline) Elhelyezés cellán belül.
- nowrap Nem engedi a tördelést.
- colspan=[columns] Több oszlopnyi széles bejegyzés.
- rowspan=[rows] Több sornyi hosszú bejegyzés.
- width=([pixel]|[%]) Cellaszélesség.

Listák

<ol> ... </ol> Számozott lista.
<ul> ... </ul> Számozatlan lista.
<menu> ... </menu> Menülista.
<dir> ... </dir> Könyvtárlista alak.
<li> Listaelem.
- type=[A|a|I|i|1] Elemjelölô alakja (számozott listáknál).
- type=[disc|circle|square] Elemjelölô alakja (számozatlan listáknál).
<dl> ... </dl> Definíció.
- <dt> Definíció fejrésze.
- <dd> Definíció törzsrésze.

Tördelés

<pre> ... </pre> Elôre tördelt szöveg.
- width=[chars] Szöveg szélessége betűben.

Kapcsolatok

<a> ... </a> Kapcsolatjelzés.
- href=(file|url) Link.
- name= Címke.
<img> Beépített kép jelzése.
- src=(file|url) A kép forrása.
- href=(file|url) Link.
- align=(left|right|top|texttop|middle|absmiddle|baseline|bottom|absbottom) Elhelyezés.
- width=([pixel]|[%]) Képszélesség.
- height=([pixel]|[%]) Képmagasság.
- vspace=([pixel]|[%]) Kép környezetének szélessége.
- hspace=([pixel]|[%]) Kép környezetének magassága.
- border=[pixel] Keretszélesség.
- usemap=(file|url) Linktérkép kapcsolat.
  - <map> ... </map> Linktérkép.
  - <area> Tartomány.
    - shape=rect Téglalap alakú tartomány.
    - coords="x1,y1,x2,y2" Koordináták.
    - href=(file|url) Link.
    - nohref Inaktív terület.

Levelezési cím

<address> ... </address> Levelezési cím.

Stílusok

Hangsúlyos: <EM>Hangsúlyos</EM>
Idézet: <CITE>Idézet</CITE>
Változó neve: <VAR>Változó neve</VAR>
Erôsen hangsúlyos: <STRONG>Erôsen hangsúlyos</STRONG>
_{Alsó index:} <SUB>Alsó index</SUB>
^{Felsô index:} <SUP>Felsô index</SUP>
Forráskód: <CODE>Forráskód</CODE>
Példa: <SAMP>Példa</SAMP>
Begépelt szöveg: <KBD>Begépelt szöveg</KBD>
Nagyított kiírás: <BIG>Nagyított kiírás</BIG>
Kicsinyített kiírás: <SMALL>Kicsinyített kiírás</SMALL>
Hét egyre kisebb különbözô méretû betûkészlet választható:
<FONT SIZE=[+|-]méretCOLOR="[RRGGBB]|[szín neve]"> ... </FONT>.
Alapértelmezett betûméret: <BASEFONT size=-2>méret</BASEFONT>

Különleges betűk leírói

&quot;   " idézôjel               &macr;   ¯ felsô vonal            
&amp;    & kereskedelmi "és"      &deg;    ° fok                    
&lt;     < kisebb, mint           &plusmn; ± plusz-minusz jel            
&gt;     > nagyobb, mint          &sup2;   ² négyzet         
&nbsp;     nem vágható szóköz     &sup3;   ³ köb                      
&iexcl;  ¡ fordított felkiáltójel &acute;  ´ felsôvesszô              
&cent;   ¢ amerikai cent          &micro;  µ mikro                     
&pound;  £ angol font             &para;   ¶ bekezdéshatároló         
&curren; ¤ általános pénzjel      &middot; · kis középsô pont         
&yen;    ¥ japán yen              &cedil;  ¸ "farkinca"               
&brvbar; ¦ függôleges vonal       &sup1;   ¹ elsô hatvány             
&sect;   § paragrafusjel          &ordm;   º hímnem                   
&uml;    ¨ kétpont (umlaut)       &raquo;  » belsô idézôjel (vég)   
&copy;   © copyright              &frac14; ¼ egynegyed                     
&ordf;   ª nônem jele             &frac12; ½ fél                           
&laquo;  « belsô idézôjel (kezdô) &frac34; ¾ háromnegyed                   
&not;    ¬ logikai nem            &iquest; ¿ fordított kérdôjel            
&shy;     kötôjel                &times;  × szorzásjel                    
&reg;    ® kereskedelmi védjel    &div;    ÷ osztásjel

Ékezetes betűk leírói

&AElig;  Æ    &aelig;  æ
&Aacute; Á    &aacute; á
&Acirc;  Â    &acirc;  â
&Agrave; À    &agrave; à
&Aring;  Å    &aring;  å
&Atilde; Ã    &atilde; ã
&Auml;   Ä    &auml;   ä
&Ccedil; Ç    &ccedil; ç
&ETH;    Ð    &eth;    ð
&Eacute; É    &eacute; é
&Ecirc;  Ê    &ecirc;  ê
&Egrave; È    &egrave; è
&Euml;   Ë    &euml;   ë
&Iacute; Í    &iacute; í
&Icirc;  Î    &icirc;  î
&Igrave; Ì    &igrave; ì
&Iuml;   Ï    &iuml;   ï
&Ntilde; Ñ    &ntilde; ñ
&Oacute; Ó    &oacute; ó
&Ocirc;  Ô    &ocirc;  ô
&Ograve; Ò    &ograve; ò
&Oslash; Ø    &oslash; ø
&Otilde; Õ    &otilde; õ
&Ouml;   Ö    &ouml;   ö
              &szlig;  ß
&THORN;  Þ    &thorn;  þ
&Uacute; Ú    &uacute; ú
&Ucirc;  Û    &ucirc;  û
&Ugrave; Ù    &ugrave; ù
&Uuml;   Ü    &uuml;   ü
&Yacute; Ý    &yacute; ý
              &yuml;   ÿ

Megjegyzés

Ha kód szerint akarunk valamit beírni, úgy az & jel után egy # jelet kell írnunk, majd a kódot decimálisan és ugyanúgy a ; jellel kell zárnunk, mint más speciális jeleket.

Szövegszerkesztôk UNIX alatt

Pico

Teljes képernyôs szövegszerkesztô, a kurzornyilak és a backspace (megfelelô terminálbeállítás esetén) használhatók. Egyéb szerkesztôbillentyűk:

^X Kilépés mentéssel.
^C Kilépés mentés nélkül.
^R Másik állomány beemelése.
^W Keresés.
^Y Lapozás felfelé.
^V Lapozás lefelé.
^K Sortörlés.
^U Utoljára törölt sor visszahozása.
^O Mentés kilépés nélkül.
^6 Blokk kijelölés (utána ^K és ^U blokkáthelyezésre és duplikálásra használható)

Joe

Teljes képernyôs szövegszerkesztô, a kurzornyilak és a backspace (megfelelô terminálbeállítás esetén) használhatók. Egyéb szerkesztôbillentyűk:

^KX Kilépés mentéssel.
^C Kilépés mentés nélkül.
^KR Másik állomány beemelése.
^KF Keresés.
^U Lapozás felfelé.
^V Lapozás lefelé.
^Y Sortörlés.
^- Utoljára törölt sor visszahozása.
^KD Mentés kilépés nélkül.
^KB ... ^KK Blokk kijelölés.
^KH Help.

Megjegyzés

Számos egyéb szövegszerkesztô létezik még.

Színkódok

                R G B                       R G B

Fekete         #000000      Sötétszürke    #545454
Kék            #0000A8      Halványkék     #5454FF
Zöld           #00A800      Halványzöld    #54FF54
Ciánkék        #00A8A8      Halványcián    #54FFFF
Vörös          #A80000      Halványvörös   #FF5454
Lila           #A800A8      Halványlila    #FF54FF
Barna          #A85400      Sárga          #FFFF54
Világosszürke  #A8A8A8      Fehér          #FFFFFF

Megjegyzés

A további színeket innen kiindulva könnyű kikeverni. Bizonyos megjelenítôk azonban nem képesek a 24bites színbontásra, ezek 16, 8 vagy 4 bitre alakítják át a kapott értékeket. Ügyeljünk arra, hogy egy ilyen konverzió nem tegye olvashatatlanná lapunkat! (Nézzük meg egy 256 színű (VGA), vagy szürkeárnyalatos (monoVGA) monitoron!)

Képmanipulátorok

XV

UNIX/X alatt futó program, eredetileg képnézegetônek készült. Indítása:

xv &

FIGYELEM! Karakteres üzemmódban nem fut!

Kép betöltése
A load nyomógombot választva a megjelenô ablakban kell kiválasztanunk, vagy beírnunk a betöltendô kép nevét.
Formátumkonverzió
Az XV a fôbb képformátumokat ismeri. A betöltött képet más formátumban a Save nyomógombot megnyomva lehet elmenteni. A megjelenô ablakban a GIF,JPEG,... (változó feliratú) nyomógomb mögött található listával módosíthatjuk a mentés formátumát. A program elvileg a kiterjesztést automatikusan a helyesre állítja, ez azonban egy hiba miatt nincs mindig így, ellenôrizni, esetleg javítani kell!
Méretezés
Az Image size nyomógomb mögötti listában dupla, fél, stb. elôre definiált méretet, vagy saját beállítást adhatunk meg. A képet ezek után még menteni kell!
Vágás
Keretes képeket automatikusan körbeszab az Autocrop. Más esetben a képen a bal egérgomb egyszeri lenyomásával kezdhetünk téglalap alakú terület kijelölésébe. A gombot felengedve rögzül a terület, ezt azonban utólag a szélek elhúzásával még módosíthatjuk. A Crop mgnyomásával a vágás megtörténik, ezt az Uncrop még vissza tudja állítani.

Photostyler

Windows 3.x alatt futó program, kimondottan képek manipulálására. Indítása a megfelelô ikonra való kattintással történik.

Kép betöltése
A File menü Open opcióját válasszuk ki, majd a megjelenô listából válasszuk ki a minket érdeklô képet.
Formátumkonverzió
A betöltött képet a File menü Save as opciójával és a kívánt formátum kiválasztásával menthetjük el új formátumban.
Méretezés
A betöltött képet a Transform menü Resize opciójával méretezhetjük át. A képet ezek után még menteni kell!
Vágás
A lebegô ikontáblából válasszuk ki az ollót, majd a kivágandó képrészlet sarkától a bal egérgombot lenyomva folyamatosan húzzuk a kívánt terület kijelöléséig az egeret. A kijelölt területre duplán rákattintva a vágás megtörténik. Ezt a Edit menü Undo opciója tudja visszavonni.

Graphic Workshop

DOS alatt futó program, kimondottan képek manipulálására. Indítása:

GWS.EXE

Kép betöltése
A képernyőn látható listából a kurzornyilakkal keresünk rá a kívánt képre, majd ENTER.
Formátumkonverzió
A kiválasztott képre F2-t ütve a megjelenő ablakban választjuk ki új formátumot és ENTER.
Méretezés
A kiválasztott képre F8-at ütve írhatjuk be a nagyítás illetve kicsinyítés mértékét százalékban, majd F10-re ezt véglegesítjük. A program ezután az általunk választott formátumban menti a képet.
Vágás
A kiválasztott képre F5-öt ütve áttekintő (fekete-fehér) kép jelenik meg. A kurzornyilakkal mozgathatjuk a vágás határait, a bal shifttel a bal oldali és felső, a jobb shifttel a jobb oldali és alsó határolóvonalat. F10-re ezt véglegesítjük. A program ezután az általunk választott formátumban menti a képet.

Megjegyzés

Mindhárom program számos egyéb lehetôséggel rendelkezik, illetve más hasonló funkciójú programok is léteznek.

GIF-manipulátorok

Giftool

A giftool váltottsoros letöltôdésű és áttetszô képeket állít elô. Használata:

giftool [kapcsolók] [kép]
giftool (-p|-c|-B) [kapcsolók] [képek]

-B
Felülírja a bemeneti képet.
-i
Váltottsoros képet állít elô.
+i
Váltottsoros képbôl normál képet állít elô.
-p
Információt ad a kép(ek)rôl.
-c
Kiírja a képhez mellékelt megjegyzést.
+c
Megjegyzést mellékel a képhez.
-C
Törli a megjegyzést.
-o
A kimeneti képállomány neve.
-rgb name
Az áttetszôvé teendô szín neve.
-rgb ##,##,##
Az áttetszôvé teendô szín RGB kódja.
-###
Az áttetszôvé teendô szín sorszáma.

Példa:

giftool -B -i *.gif

Whirlgif

A whirlgif animált képeket állít elô. Használata:

whirlgif [-o kimenetikép] [-loop [számszor]] [-time #várakozás]
         [-i listaállomány] kép1 [-time #várakozás] kép2 ...

-o
Az animált (kimeneti) kép neve.
-loop
Az ismétlések száma (ha elmarad a szám, az végtelen ciklus).
-time
Várakozási idô az egyes képek közt.
-i
Az animáció fázisait tartalmazó lista neve.

Elôzô fejezet | Tartalom | Következô fejezet