Alapfogalmak • internet: az egész világot körülölelő számítógép hálózat
• www (World Wide Web): az interneten működő, egymással ún. hiperlinkekkel összekötött dokumentumok rendszere
• HTTP (Hyper Text Transfer Protocol): egy információátviteli mód az interneten, az eredeti célja a HTML lapok publikálása és fogadása volt
• HTML (Hyper Text Markup Language): egy leíró nyelv, melyet web oldalak készítéséhez fejlesztettek ki XHTML
HTML példa Madarasi Menedékház <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
…………………………………………………………………………………………………………………………………
HTML dokumentum részei • Dokumentum Típus Definíció (DTD)
• HTML fejléc technikai és dokumentációs adatokat tartalmaz Kötelező!!! Az oldal címe <meta http-equiv="Content-type" content="text/html;charset=az oldal kódolása"> <meta name="AUTHOR" content="Az oldal készítője"> <meta name="KEYWORD" content="kulcsszó1, kulcsszó2"> <meta name="DESCRIPTION" content="Az oldal leírása"> <meta http-equiv="Refresh" content="5;url=http://www.w3schools.com"> ………
• HTML törzs a megjelenítendő információkat tartalmazza Az oldal tartalma
Példa oldal Az oldal címe <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2"> Az oldal tartalma
Így lehet kétféle, nem mindig azonos <STRONG>kövér, kétféle <EM>dõlt, aláhúzott, ill. FIX jelszélességû szövegrészt írni.
Kombinálhatjuk is.
Így pedig <SUP>felsõ, ill. <SUB>alsó indexet írhatunk.
Lehetõség van a TT=teletype, BIG, <SMALL>SMALL és <STRIKE>STRIKE jeltipusok használatára. (Nem minden böngészõ érti mindegyiket. Ha nem érti, figyelmen kívül hagyja.)
Láthatjuk, hogy egy parancs hatása olyan másikkal zárható le, ami a "parancs"-szó ismétlésébõl és egy az elé tett "/" jelbõl áll.
A "FONT" paranccsal betûméretet vagy betûszínt állíthatunk be. A méret 1-tõl kezdve növekszik, a szín vagy angol elnevezés (140 lehetõségbõl), vagy RGB kód #RRGGBB formában. Az RGB (Red=piros, Green=zöld, Blue=kék) kód hexadecimálisan (16-os számrendszerben) írandó, és így a piros-zöld-kék arányt több, mint 16 millió módon adhatjuk meg (#000000 és #FFFFFF között).
Néhány példa:
1-es méret 2-es méret 3-as méret 4-es méret 5-ös méret 6-os méret red = #FF0000 green = #008000 lime = #00FF00 blue = #0000FF #ABCDEF (nincs neve) #123456 (meg ennek sincs)
• egyéb tulajdonságok: width="100px" height="100px"
width="50%" height="30%"
• kép, mint link
Példa Képek <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
Ha az aktuális lapra akarunk képeket behozni, az "IMG" kulcsszóval megtehetjük. Bekeretezhetjük a képet, és a szöveg mögé (ALIGN=right) vagy elé (ALIGN=left) tehetjük, úgy, hogy a szöveg a képet "körülveszi".
A "BORDER" mögött a keret méretét, a HSPACE ill. VSPACE mögött a kép mellett ill. az alatta-fölötte levõ üres rész méretét (képernyõ pontokban) adhatjuk meg. A keret színe az aktuális betûszín, amit minden képre külön beállíthatunk. Ha nem az eredeti méretében akarjuk a képet mutatni, akkor a "HEIGHT=" ill. "WIDTH=" paraméter is szóba jöhet. (Ezt is képpontokban mérve.) Ilyenkor torzulhat a kép, ha rossz arányban méretezzük át.
Táblázatok • sablon
Táblázat leírás
Fejléc 1
Fejléc 2
1. sor, 1. oszlop
1. sor, 2. oszlop
2. sor, 1. oszlop
2. sor, 2. oszlop
Táblázatok
• TABLE tulajdonságok – – – – –
cellpadding=hossz a cella kerete és tartalma közti üres hely mérete cellspacing=hossz a cellák közötti távolság width=érték a táblázat (vagy akár a cella) szélessége bgcolor=szín a táblázat (vagy cella) háttérszíne background="hatterkep.jpg" a táblázat (vagy cella) háttérképe
Példa
Cella háttérszíne
Szín neve
RGB kódja
black
#000000
blue
#0000FF
cyan
#00FFFF
green
#008000
magenta
#FF00FF
red
#FF0000
white
#FFFFFF
Példa
Cellák egybeolvasztása
Elsõ sor
három összevont oszloppal
2. és 3. sor 1. oszlopa összevonva
Ez a
2.
sor
Ez a
3.
sor
A BODY tulajdonságai • BACKGROUND="kép.jpg" háttérkép • BGCOLOR="szín" háttérszín • TEXT="szín" az oldal szövegének színe • • • •
LEFTMARGIN="hossz" bal margó vastagsága RIGHTMARGIN="hossz" jobb margó vastagsága TOPMARGIN="hossz" felső margó vastagsága BOTTOMMARGIN="hossz" alsó margó vastagsága
Oldal szerkezete táblázattal Oldal <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
Ha az aktuális lapra akarunk képeket behozni, az "IMG" kulcsszóval megtehetjük. Bekeretezhetjük a képet, és a szöveg mögé (ALIGN=right) vagy elé (ALIGN=left) tehetjük, úgy, hogy a szöveg a képet "körülveszi".
A "BORDER" mögött a keret méretét, a HSPACE ill. VSPACE mögött a kép mellett ill. az alatta-fölötte levõ üres rész méretét (képernyõ pontokban) adhatjuk meg. A keret színe az aktuális betûszín, amit minden képre külön beállíthatunk. Ha nem az eredeti méretében akarjuk a képet mutatni, akkor a "HEIGHT=" ill. "WIDTH=" paraméter is szóba jöhet. (Ezt is képpontokban mérve.) Ilyenkor torzulhat a kép, ha rossz arányban méretezzük át.