HTML (Hypertext Mark-Up Language). Jellemzői Szöveges alapú internetes oldalak nyelve A formázási műveleteket is szövegesen írja le Szöveget, képeket,

Az előadások a következő témára: "HTML (Hypertext Mark-Up Language). Jellemzői Szöveges alapú internetes oldalak nyelve A formázási műveleteket is szövegesen írja le Szöveget, képeket,"— Előadás másolata:

1 HTML (Hypertext Mark-Up Language)

2 Jellemzői Szöveges alapú internetes oldalak nyelve A formázási műveleteket is szövegesen írja le Szöveget, képeket, nyomógombokat, hipertextes hivatkozásokat (azaz linkeket) tartalmazhat Jegyzettömbbel, vagy karakteres szövegszerkesztővel is szerkeszthető Platform független Fájlkiterjesztése: *.htm, vagy *.html

3 Felépítése.. Két egységből áll:  Fej  Test Az egyes egységek neveit, valamint a formázási utasításokat relációjelek közé tesszük. Ezeket TAG- eknek (ejtsd: „tegeknek”) nevezzük. A TAG-ek többségét le kell zárni, ezt a / jellel jelöljük.

4 1. Példa (index01.html) Első próba Üdvözlöm az első próba alkalmával! Itt megnézheti: index_01.htmlindex_01.html

5 2. Példa (index02.html) Első próbák Üdvözlöm az első próba alkalmával! Most a kék háttéren fehér betűket lát. Itt megnézheti: index_02.htmlindex_02.html

6 3. Példa (index03.html) Példa címekre Címsor minta1 Címsor minta2 Címsor minta3 Címsor minta4 Címsor minta5 Címsor minta6 Ha nem alkalmazzuk a címsor stílusokat, akkor normál szöveget kapunk. Itt megnézheti: index_03.htmlindex_03.html

7 Szöveg igazítása Balra igazítás: Ez a mondat balra igazodik. Középre igazítás: Ez a mondat középre igazodik. Jobbra igazítás: Ez a mondat jobbra igazodik. Sorkizárt igazítás: Ez a mondat sorkizárt.

8 4. Példa (index04.html) Karakterformázás 1. normál szöveg félkövér szöveg dőlt szöveg aláhúzott szöveg félkövér dőlt szöveg Itt megnézheti: index_04.htmlindex_04.html

9 5. Példa (index05.html) Karakterformázás 2. 6-os méretű Arial karakterek 10-es méretű Arial zöld karakterek Itt megnézheti: index_05.htmlindex_05.html

10 Képek alkalmazása Az Internet Explorer 6 az alábbi képformátumokat támogatja: – Bmp – bittérképes – Gif (Gif89) – bittérképes tömörített (animált) – Jpg (Jpeg) – bittérképes tömörített – Png – vektoros (Fireworks munkafájlja) – Swf – vektoros (Flash) – (Ico – bittérképes)

11 6. Példa (index06.html) Kép beszúrása Az elefánt És az elefánt keretben…...200 képpont szélességben. Itt megnézheti: index_06.htmlindex_06.html

12 Hivatkozások alkalmazása Kétféle hivatkozás van: – Belső hivatkozás Belépéshez kattints ide! – Külső hivatkozás Pusztaszer

13 7. Példa (index07.html) Hipertext Üdvözlöm a weboldalamon! Pusztaszer Itt megnézheti: index_07.htmlindex_07.html

14 Táblázat készítése (index08.html) Bal felső Jobb felső Bal alsó Jobb alsó Itt megnézheti: index_08.htmlindex_08.html

15 Listák (index09.html) Számozatlan lista Első elem Második elem Számozott lista Első elem Második elem Itt megnézheti: index_09.htmlindex_09.html

16 Az órának vége, köszönöm a figyelmet!