A HTML nyelv alapjai

Méret: px
Mutatás kezdődik a ... oldaltól:

Download "A HTML nyelv alapjai"

Átírás

1 A HTML dokumentum felépítése A HTML nyelv alapjai Minden HTML dokumentum ún. tagokból épül fel. Ezek formája <tag>. A legtöbb tagnak létezik kezdő és záró párja is. Zárótag alakja: < tag>. A kettőt együtt HTML elemnek is nevezzük. Néhány tagnak nincs záró párja. Ezekre később térünk ki. A böngésző a tagokat mint utasításokat értelmezi, és ennek alapján tudja, hogyan jelenítse meg a weblapot. Az angol nyelvet ismerők megfigyelhetik, hogy a HTML tagok valójában angol szavak, rövidítések. A HTML dokumentumoknak van néhány kulcstagja, amelyet minden ilyen weblapnak tartalmaznia kell. Ezek a következők: html, head, title, body. <html> elem < html> Weblapunk forráskódját a <html> és a < html> tagok közé kell írnunk. <head> elem < head> A head elem különböző információkat tartalmazhat a weblapról. A weblapon közvetlenül nem jelenik meg. Ide kell elhelyeznünk például a title elemet, a meta tagokat és stílusokat is itt definiálhatunk, esetleg scripteketis helyezhetünk ide (ezekkel később foglalkozunk). <title> elem < title> A title elemet a <head> és < head> tagok közé kell elhelyeznünk. A kezdő tag és a zárótag közé írjuk a weblapunk címét, ami a címsorban fog megjelenni. <body> elem < body> Ez a weblapunk törzse. Amit ezek közé a tagok közé írunk megjelenik a weblapon is. Vágjunk is bele és hozzuk létre első weblapunkat! Íme egy egyszerű weboldal forráskódja: <html> <head> <title>első weblapom</title> </head> <body> <p> Ez az én első weblapom! </p> </body> </html> A fenti kódot egy egyszerű szövegszerkesztőbe is beírhatjuk pl. Notepadbe, majd mentsük.html kiterjesztéssel. Ezzel létre is hoztuk első weblapunkat. Megnyitás előtt ellenőrizzük, le hogy a fájl kiterjesztése valóban html, esetleg.htm. Amikor megnyitjuk a fájlt, már az

2 alapértelmezett böngészőnkben fog kinyílni. Itt már csak szöveget fogunk látni, a "< >" jelek és a közéjük írt szöveg itt nem lesz látható. Megjegyzés: Ahhoz, hogy a böngészőnkben visszanézhessük a forráskódot, a böngészőkben általában általában az egér jobb gombjára kattintva, kinyíló menüben találjuk meg az erre vonatkozó menüpontot. Bekezdések és sortörés Ha a <body> utáni részbe szöveget írunk be, az meg fog jelenni a képernyőn. Ahhoz viszont, hogy bekezdésekbe oszthassunk egy szöveget újabb tagokat kell használnunk. Erre szolgál a <p> tag és ennek zárópárja a < p>. E kettő közé kell írnunk a bekezdésünket. Minden bekezdés új sorban kezdődik. Bekezdésen belüli sortörésre a <br > tag szolgál, melynek nincs záró párja. HTML nyelven a <br> forma is működőképes, XHTML-ben a lezárt forma kötelező. Címek A HTML dokumentumban definiálhatunk címeket, ill. alcímeket hat szint mélységig. A legfelső szintű címet a <h1> és a < h2> utasításpárral kell közrezárni. A második szintet a <h2> és a < h2> utasítások határolják, és így tovább a hatodik szintig. Minden szint más-más betűformátumban jelenik meg a dokumentumban, a böngészőprogram beállításától függően. HTML általános Szintaktika HTML nyelvnek van egy pár alapelve, melyet jó megemlíteni: Betűk mérete nem lényeges, <body> ugyanaz mint a <BODY> (de kompatibilitási okokból ajánlott a kisbetű használata.) Címekben és fájlnevekben lényeges a betű mérete, nem lehet itt sem betűköz sem magyar ékezetek Tagokat, melyeket böngésző nem ismeri fel, mintha nem léteznének Tag elején nem lehet betűköz, például <br> rosszul van. két betűköz egymás után (vagy több) ugyanolyan mintha csak egy lenne sor vége a kódba úgy értelmezhető mint egy betűközt Az attribútum neveket mindig jó idéző jelekbe rakni, de nem teljesen szükséges, ha belűl nincs betűköz típusú szimbólumokat forráskódba &valami; szólánccal írunk Megjegyzés a forráskódba <!-- és --> jelek közt beillesztjük <!-- Ez itt egy megjegyzés, mely nem fog megjelenni. --> Attribútumok Minden kezdőtagnak lehetnek ún. attribútumai. Ezek további információkat határoznak meg az elemről. Formája: <tag attribútomnév= "attribútumérték">. Vannak általános attribútumok és csak bizonyos tagoknál definiált attribútumok. Ismerkedjünk meg először az általánosan használható attribútumokkal: class és id attribútumok

3 Ezek az attribútumok az elemek stíluslapokkal (CSS) való formázásánál és a scripteknél játszanak szerepet. Segítségükkel csoportosítani ill. egyedileg azonosítani tudjuk a tagokat, de ezt majd akkor fogjuk igazán megérteni, amikor megismerkedünk a stíluslapok fogalmával. Egy példa: <p id= "doltbetusbekezdés"> Dőlt betűs bekezdés < p> <p id= "alahuzottbekezdés"> Aláhúzott bekezdés < p> name attribútum Name attribútum definiálásával a script nyelvekben (mint pl. Javascript, ASP, PHP) egy változót hozunk létre. Leggyakrabban űrlapelemeknél találkozhatunk velük. <input type="text" name="szovegdoboz" /> title attribútum Gyakran elfeledkeznek erről a hasznos attribútumról. Egy felugró szöveget helyezünk el vele az elem fölé, ami akkor jelenik meg, amikor fölé visszük a kurzort. <input type="text" title="ez egy feliratozott szövegdoboz" > align attribútum Horizontális igazítást tesz lehetővé. Főként szövegre szokás alkalmazni. 5 féle értéke lehet: left, center, right, justify, inherit. <p align="left">balra igazított bekezdés<p > <p align="center">középre igazított bekezdés<p > <p align="right">jobbra igazított bekezdés<p > Alapértelmezett attribútum Sok tagnak alapértelmezett attribútumai is vannak. Ez azt jelenti, hogy ha nem adunk meg az adott elemnek attribútumokat, akkor az elem bizonyos előre definiált attribútumokat kap. Például egy bekezdés szövege mindig balra lesz igazítva, ha mi nem adunk meg neki más értéket. Ahogy egyre többet tanulunk és kódolunk, egyre több ilyen alapértelmezett értéket fogunk megismerni. Gyakran használt attribútumok Attribútum Érték Funkció align right, left, center Vízszintes szövegigazítás valign top, middle, bottom Függőlegesen igazít egy HTML elemen belül. bgcolor számformátumú, hexadecimális, RGB értékek Háttérszín background URL Háttérkép. id Fejlesztő adja meg Egyedi azonosító - stíluslapoknál. class Fejlesztő adja meg Stílusosztályt definiál. width Számérték Táblázatok, képek, táblázat mezők szélessége. height Számérték Táblázatok, képek, táblázat mezők magassága. title Fejlesztő adja meg Címke - "Pop-up" szöveg. Kereszthivatkozások - linkek A HTML formátum lényegét az egymásra és egymás tartalmára való hivatkozások jelentik (vagyis a hypertext lehetőség). A dokumentum bármely részéhez hivatkozást (linket)

4 helyezhetünk el, amelyet aktivizálva, a hivatkozottal összefüggésben lévő szöveghez jutunk el. A hivatkozó utasítások megjelenési formája sokféle lehet, a célobjektumtól függően: Dokumentumon belüli hivatkozás A legegyszerűbb esetben a hivatkozás az adott fájl egy távolabbi részére mozdítja a böngészőablakot. A hivatkozás kezdetét a <A HREF="#jelző"> utasításnak a dokumentumban való elhelyezése jelzi. A hivatkozást a </a> utasítás zárja le. Ez az elempár közrezárhat szövegrészt, képet, stb. A közrezárt részt a böngészőprogram a dokumentum többi részétől eltérően jeleníti meg (pl. aláhúzással, kerettel,...), az egérkurzorral fölé érve a mutató alakja megváltozik. Azt a részt (praktikusan: könyvjelzőt), ahová a hivatkozás mutat a <a name="jelző"> és a </a> utasítások kell, hogy határolják. Egy másik dokumentumra mutató hivatkozás A legtöbb esetben a egy hivatkozás egy másik fájlra/dokumentumra mutat. A hivatkozás kezdetét ekkor a <a href="protokoll://elérési_út/fájlnév.kit"> utasítás jelzi, a hivatkozást ekkor is a </a> utasításelem zárja le. Mind a protokoll, mind az elérési út elhagyható, amennyiben azonos URL-en van a kiindulási dokumentum és a hivatkozott. A hivatkozott fájlnak e példában nincs külön névvel (könyvjelzővel) jelölt része. Működés szempontjából a fentebb leírtak vonatkoznak erre a hivatkozási formára is. Egy másik dokumentumon belüli helyre mutató hivatkozás A legbonyolultabb esetben a hivatkozás egy másik fájl valamely pontosan meghatározott részére mutat. A hivatkozás kezdetét a <a href="protokoll://elérési_út/fájlnév.kit#jelző"> utasítás jelzi, és a hivatkozást szintén a </a> elem zárja le. Ebben az esetben a hivatkozott fájl kell, hogy tartalmazzon egy olyan részt (könyvjelzőt), ahová a hivatkozás mutat. Ezt a részt a <a name="jelző"> és a </a> utasítások határolják. A legbonyolultabb esetben a hivatkozás egy másik fájl valamely pontosan meghatározott részére mutat. A hivatkozás kezdetét a <a href="protokoll://elérési_út/fájlnév.kit#jelző"> utasítás jelzi, és a hivatkozást szintén a </a> tag zárja le. Ebben az esetben a hivatkozott fájl kell, hogy tartalmazzon egy olyan részt (könyvjelzőt), ahová a hivatkozás mutat. Ezt a részt a <a name="jelző"> és a </a> utasítások határolják. Letöltő hivatkozások Ha ilyen alakban adunk meg egy linket <a href="protokoll://elérési_út/fájlnév.kit">letölthető állomány</a>, és a böngésző nem tudja megjeleníteni a fájltípust, a böngésző automatikusan felajánlja, hogy letöltsük a fájlt. címre mutató link címre mutató linket is elhelyezhetünk a weboldalunkon, amelyre kattintva a felhasználó üzenetet küldhet nekünk. Alakja: <a href="mailto:xy@xy.com?subject=valami">xy@xy.com</a> Megjegyzés:

5 Az <a here = "...">, </a> utasításpár képet is közre foghat, ilyenkor a kép szegéllyel jelenik meg. Ezt letilthatjuk például a stíluslapok segítségével a border: none; utasítással. Erről bővebben a CSS részben foglalkozunk. Target attribútum Ez az attribútum határozza meg, hogy a link a jelenlegi ablakban nyíljon meg vagy egy új ablakban. target= "_blank" Egy új ablakban/lapon nyitja meg az oldalat. "_self" A jelenlegi ablakban nyitja meg az oldalat. "_parent" Abban a frameben nyitja meg az oldalat, ahol a link található. "_top" Abban az ablakban nyitja meg az oldalat, ahol elhelyezkedik a link, a frameket felülírva. Képek a HTML weboldalon A HTML dokumentumban képeket is elhelyezhetünk. Az <img src="elérési_út/fájlnév.kit">> utasítás a szöveg aktuális pozíciójába helyezi a megadott képet. Ennél azért a legegyszerűbb szövegszerkesztő program is többet nyújt. A HTML dokumentum csinosítására is vannak a képek elhelyezésének finomabb lehetőségei is. Ha ezeket mind kihasználjuk, akkor az utasítás a következőképpen fog kinézni: <img align="hely" src="elérési_út/fájlnév.kit" hspace="vszám" vspace="fszám" width="szméret" height="mmeret" units="egység" usemap="#jelzõ" ismap alt="szöveg">. Az align opció meghatározza a kép igazításának módját, lehetséges értékei: top, middle, bottom, left, right. A hspace a kép melletti vízszintes térközt, a vspace pedig a függőleges térközt (ha úgy tetszik: margókat) határozza meg. A width a szélességét, a height pedig a magasságát adja a képnek, az units által meghatározott egységben (pixel vagy en). Az alt azt a szöveget adja meg, amelyet nem grafikus böngészők használata esetén meg fog jelenni a kép helyett. <img src="half-dome-in-national-park_w400_300.jpg" alt="half dome in national park" width = "400" height = "300"/> Megjegyzés: A weben használatos képformátumok:.jpg,.png és.gif. Táblázatok Természetesen weboldalunkba táblázatokat is illeszthetünk. egy táblázat kezdetét a <table> tag jelzi. A table elemen belül definiáljuk a sorokat - <tr> és ezeken belül az oszlopokat - <td>. A <th> taggal a táblázaton belül címeket definiálhatunk. Ezek a címek az oszlopok felett általában félkövér betűkkel jelennek meg.

6 <table border="1"> <th>oszlop 1</th> <th>oszlop 2</th> <tr><td>1. sor 1. oszlop</td><td>1. sor 2. oszlop</td></tr> <tr><td>2. sor 1. oszlop</td><td>2. sor 2. oszlop</td></tr> </table> Eredmény: Oszlop 1 Oszlop 2 1. sor 1. oszlop 1. sor 2. oszlop 2. sor 1. oszlop 2. sor 12. oszlop Sorok és oszlopok egyesítése A HTML nyelv lehetőséget kínál sorok és oszlopok egyesítésére is. Erre a rowspan és colspan használható. <table border="1"> <tr> <th>1. oszlop</th> <th>2. oszlop</th> <th>3. oszlop</th> </tr> <tr><td rowspan="2">1. oszlop 1. cella</td> <td>1. oszlop 2. cella</td><td>1. sor 3. cella</td></tr> <tr><td>2. sor 2. cella</td><td>2. sor 3. cella</td></tr> <tr><td colspan="3">3. sor 1. cella</td></tr> </table> Eredmény: 1. oszlop 2. oszlop 3. oszlop 1. oszlop 1. cella 1. oszlop 2. cella 1. sor 3. cella 2. sor 2. cella 2. sor 3. cella 3. sor 1. cella cellspacing és cellpadding attribútumok A cellspacing-gel a keret vastagságát, a cellpadding-gal pedig a cellák keretek közötti távolságot adjuk meg. Példa cellspacing-ra: <table border="1" cellspacing="10" <tr> <th>1. oszlop</th> <th>2. oszlop</th> </tr> <tr><td>1. sor 1. cella</td><td>1. sor 2. cella</td></tr> <tr><td>2. sor 1. cella</td><td>2. sor 2. cella</td></tr> </table>

7 Eredmény: 1. oszlop 2. oszlop 1. sor 1. cella 1. sor 2. cella 2. sor 1. cella 2. sor 2. cella Példa cellpadding-ra: <table border="1" cellpadding="10" <tr> <th>1. oszlop</th> <th>2. oszlop</th> </tr> <tr><td>1. sor 1. cella</td><td>1. sor 2. cella</td></tr> <tr><td>2. sor 1. cella</td><td>2. sor 2. cella</td></tr> </table> Eredmény: 1. oszlop 2. oszlop 1. sor 1. cella 1. sor 2. cella 2. sor 1. cella 2. sor 2. cella Megjegyzés: A megadott számértéket a böngésző pixelekként értelmezi - ugyanez vonatkozik a legtöbb számértékkel megadott attribútumra is. Pixelek helyett százalékokban is megadhatjuk ezeket az értékeket. Ilyenkor "%" jelet írunk a szám után. Arra, hogy ezt a százalékot miből kell számítani nincs általános szabály. Egyes esetekben az alapértelmezett méretből, máskor a szülő elemből (az adott tagot tartalmazó elemből). Listák a weboldalon A HTML nyelvben 3 különböző listatípus létezik. Az <ol> tag egy számozott listát kezd, az <ul> számozatlan listát, a <dl>-t leíró listákra használjuk, ahol az egyes lista elemekhez tartozhat egy hosszabb leírás is. Számozott lista A számozott lista kezdő tagja az <ol>, záró tagja az </ol>. A számozott listák sorai az <li> utasítással kezdődnek. Ennek a záró párja a </li>. <ol> <li>első sor</li> <li>második sor</li> <li>harmadik sor</li> </ol> Eredmény: Első sor Második sor Harmadik sor

8 Ha nem az 1.-vel szeretnék kezdeni a listánk számozását, használjuk a start attribútumot! <ol start = "3"> <li>harmadik elem</li> <li>negyedik elem</li> <li>ötödik elem</li> </ol> Eredmény: Harmadik elem Negyedik elem Ötödik elem A számozott listának további fajtái is vannak. Arab számok helyett használhatunk római számokat is vagy az ABC betűit - mindkét esetben megkülönböztetünk kis betűs és nagy betűs változatot is: <ol type="a"> <ol type="a"> <ol type="i"> <ol type="i"> Számozatlan lista A számozatlan lista kezdő tagja az <ol>, záró tagja az </ol>. A számozatlan listák sorai - a számozott listákhoz hasonlóan - <li> utasítással kezdődnek és </li> taggal végződnek. <ul> <li>tej</li> <li>vaj</li> <li>jogurt</li> </ul> A számozatlan listának szintén vannak különböző változatai: <ul type="square"> <ul type="disc"> <ul type="circle"> type="square" type="disc" type="circle" Leíró lista A leíró listát a <dl> és a </dl> utasítások közé kell zárni. A listák egyes alkotóelemet a <dt> és </dt> tagok jelzik, az ehhez tartozó leírást pedig a <dd> és </dd> tagpár határozza meg. <dl> <dt><b>html</b></dt> <dd>weblapok struktúráját leíró programozási nyelv.</dd>

9 <dt><b>http</b></dt> <dd>az internet egyik legfontosabb protokollja.</dd> </dt> </dl> HTML Weblapok struktúráját leíró programozási nyelv. HTTP Az internet egyik legfontosabb protokollja. Meta tagok A meta tagok információkat szolgáltatnak a kereső robotok (pl. Google, Yahoo...)számára, így könnyebben megtalálható lesz az oldalunk. Ezeket a meta tagokat a felhasználók nem látják. Régebben ez volt az egyetlen módszer, hogy a kereső robotok észrevegyék a weblapot. Ma már ez így nem igaz, de még mindig jó, ha használjuk őket. Ezeket a tagokat az oldalunk fejrészébe (<head> utáni rész) kell elhelyeznünk. Ez egy páratlan tag. keyword meta tag A meta tag content attribútumába kell elhelyeznünk azokat a kulcsszavakat és kifejezéseket, amelyekről úgy gondoljuk, hogy valaki ezek alapján fog rákeresni az oldalunkra. A name attribútum határozza meg, hogy milyen meta tagról van szó. Az egyes kulcsszavakat vesszővel kell elválasztani. Ennek az oldalnak például ilyen keywords metatagja lehetne: <meta name="keywords" content="html,html tanfolyam,html oktatás"> description meta tag Ide 1-2 mondatos leírást írhatunk a weblapról. autor meta tag Az autor meta tag megadásával a nevünk alapján is megtalálhatóak leszünk a keresőprogramok számára. <meta name="author" content="esse Zsolt" /> revised meta tag Ide azt írjuk le, mikor módosítottuk, frissítettük utoljára az oldalat. <head> <meta name="revised" content="esse Zsolt, 17/2/2011" /> </head> refresh meta tag Előfordulhat olyan eset is, hogy valamilyen okból kifolyólag le kell cserélni az aktuálisan megjelenített oldalat egy másikra vagy bizonyos időközönként frissíteni kell. Erre szolgál a refresh meta tag. Alakja a követkető: <meta http-equiv="refresh" content="3,

10 Karakterkódolás Ez a tag azt jelzi a böngésző számára, hogy milyen karakterkészletet használjon. Ez garantálja, hogy ékezetes karaktereink helyesen jelenjenek meg. Közép-európai betűk használatához pl. az iso vagy az általánosabb utf-8-as jelzésű karakterkészletet kell alkalmazni. HTML4.01 forma: <meta http-equiv="content-type" content="text/html; charset=iso "> <meta http-equiv="content-type" content="text/html; charset=utf-8"> HTML5 forma: <meta charset="iso "> <meta charset="utf-8"> Doctype Azt, hogy a weblapunkat a HTML nyelv melyik változatában készítettük el, a doctype taggal adjuk meg. A <html> elem elé kell beszúrnunk. Ne feledkezzünk meg róla, mert ha kihagyjuk, előfordulhat, hogy helytelenül jeleníti meg a felhasználó böngészője az oldalat! A legismertebb doctype-k a következők: HTML4.01 doctype-k Strict <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" " Transitional <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " Frameset <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" " HTML5 doctype <!DOCTYPE html;> XHTML doctype-k Strict <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " Transitional <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " Frameset <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "

11 A weblap tartalmának elrendezése Weblapunk tartalmát, valamilyen módon el kell rendeznünk az oldalon belül, hiszen nem szép látvány ha mindent egymás alá rakunk. Régebben ezt úgy oldották meg, hogy az oldalat ún. ekre osztották, egy időben pedig a táblázatokkal való elrendezés volt a "divat". Ma már inkább a div tagokkal való felosztás javasolt. Ezek önmagukban csak logikailag tagolják az oldalat, a formázást stílusok használatával kell megoldanunk. Íme egy klasszikus weblap elrendezés:

HTML kódolás Web-lap felépítése. Az egész törzsre érvényes utasítás. <HTML> web-lap kezdő utasítás: a dokumentum kezdődik, a böngészőnek szól

HTML kódolás Web-lap felépítése. Az egész törzsre érvényes utasítás. <HTML> web-lap kezdő utasítás: a dokumentum kezdődik, a böngészőnek szól HTML kódolás Web-lap felépítése web-lap kezdő utasítás: a dokumentum kezdődik, a böngészőnek szól fejléc kezdő utasítás: a böngészőnek és a kereső robotoknak szóló elemek Fejléc elemek,

Részletesebben

Webprogramozás HTML alapok 2. 3. előadás

Webprogramozás HTML alapok 2. 3. előadás Webprogramozás HTML alapok 2. 3. előadás Hivatkozások - linkek Link: más webes tartalomra történő irányítás Hivatkozások - linkek abszolút hivatkozás fizika kar weboldala

Részletesebben

ÁLTALÁNOS WEBLAPSZERKESZTÉSI TUDNIVALÓK ÁLTALÁNOS HTML KÓDOLÁSI TUDNIVALÓK

ÁLTALÁNOS WEBLAPSZERKESZTÉSI TUDNIVALÓK ÁLTALÁNOS HTML KÓDOLÁSI TUDNIVALÓK ÁLTALÁNOS WEBLAPSZERKESZTÉSI TUDNIVALÓK HTML dokumentum = weblap = weboldal = webpage Egy HTML dokumentum kiterjesztései: HTM vagy HTML STÍLUSLAP = Egy vagy több HTML utasítás, értékekkel ellátott paramétereinek

Részletesebben

HTML kódok. A www jelentése World Wide Web.

HTML kódok. A www jelentése World Wide Web. HTML kódok A www jelentése World Wide Web. A HTML (angolul: HyperText Markup Language=hiperszöveges jelölőnyelv) egy leíró nyelv, melyet weboldalak készítéséhez fejlesztettek ki. A honlap felépítése (csak

Részletesebben

Multimédia 2017/2018 II.

Multimédia 2017/2018 II. Multimédia 2017/2018 II. 1. gyakorlat HTML5, CSS3 alapok Alapvető HTML5 elemek Egyszerű HTML dokumentum Oldal cime

Részletesebben

Képek a HTML oldalon

Képek a HTML oldalon Képek a HTML oldalon Utolsó módosítás: 11/22/2004 13:07:28 Háttérkép Ahhoz, hogy az adott oldal háttérképpel rendelkezzen, a részben el kell helyeznünk a background="kep" paramétert, ahol a kép

Részletesebben

HTML alapok. A HTML az Internetes oldalak nyelve.

HTML alapok. A HTML az Internetes oldalak nyelve. A HTML az Internetes oldalak nyelve. HTML alapok Karakteres szövegszerkesztővel (pl. Jegyzettömb) szerkeszthető. FONTOS, hogy az elkészült oldal kiterjesztése ne txt, hanem html legyen! Felépítése: Két

Részletesebben

Táblázatok. Utolsó módosítás: 11/22/ :07:23

Táblázatok. Utolsó módosítás: 11/22/ :07:23 Táblázatok Utolsó módosítás: 11/22/2004 13:07:23 A táblázat megadása a tag használatával lehetséges. A és tageken belül, a elemekkel adhatjuk meg a táblázat sorait. A elemek a sorokon

Részletesebben

Kövér betűk (bold) 1-es fejléc

Kövér betűk (bold) 1-es fejléc A HTML Stuktúra Amint a bevezetőben olvashattuk, minden HTML formátumú szövegfájl a utasítással kezdődik és a záró utasítással végződik. A dokumentumot a fejlécelemek vezetik be, melyek

Részletesebben

A HTML Stuktúra. 1. oldal, összesen: 8 oldal. mhtml:file://d:\vizsga\1\html kódok.mht. Betűtípusok, stílusok <b> <i> <u> <tt>

A HTML Stuktúra. 1. oldal, összesen: 8 oldal. mhtml:file://d:\vizsga\1\html kódok.mht. Betűtípusok, stílusok <b> <i> <u> <tt> 1. oldal, összesen: 8 oldal főoldal weboldalkészítés kereső optimalizálás HTML kód meta elemek képek beillesztése frame táblázatok XHTML XML CSS szabvány JavaScript vista tudás vista telepítése ingyen

Részletesebben

Internet, Az internet főbb szolgáltatásai web keresőszolgáltatásokkal Keresőrendszerek: Kulcsszavas 2) Egyéb keresők: Metakeresők gyűjtőkörű keresők

Internet, Az internet főbb szolgáltatásai web keresőszolgáltatásokkal Keresőrendszerek: Kulcsszavas 2) Egyéb keresők: Metakeresők gyűjtőkörű keresők Web alapok Az Internet, számítógépes hálózatok világhálózata, amely behálózza az egész földet. Az internet főbb szolgáltatásai: web (www, alapja a kliens/szerver modell) elektronikus levelezés (e-mail)

Részletesebben

WEB TECHNOLÓGIÁK 2.ELŐADÁS

WEB TECHNOLÓGIÁK 2.ELŐADÁS Dr. Pál László, Sapientia EMTE, Csíkszereda WEB TECHNOLÓGIÁK 2.ELŐADÁS 2014-2015 tavasz A HTML nyelv alapjai Mi a HTML? A HTML (angolul: HyperText Markup Language=hiperszöveges jelölőnyelv) Leíró nyelv,

Részletesebben

HTML é s wéblapféjlészté s

HTML é s wéblapféjlészté s HTML é s wéblapféjlészté s 1. Melyik országból ered a hipertext-es felület kialakítása? USA Japán Svájc 2. Webfejlesztéskor ha a site-on belül hivatkozunk egy file-ra, akkor az elérési útnak... relatívnak

Részletesebben

Megoldás (HTML) <!DOCTYPE HTML> <html>

Megoldás (HTML) <!DOCTYPE HTML> <html> Búbos banka 20 pont A következő feladatban egy weboldalt kell készítenie a búbos banka rövid bemutatására a feladatleírás és a minta szerint. A feladat megoldása során a következő állományokat kell felhasználnia:

Részletesebben

Web programozás. 3. előadás

Web programozás. 3. előadás Web programozás 3. előadás Űrlapok form label for input type select, option value szöveges mező: text textarea jelszó: password rádiógomb: radio jelölőnégyzet: checkbox küldés gomb: submit Web programozás

Részletesebben

w w w. h a n s a g i i s k. h u

w w w. h a n s a g i i s k. h u Weblapkészítés weblap: hypertext kódolású dokumentumok, melyek szöveget képet linkeket, könyvjelzőket/horgonyokat táblázatokat / szövegdobozokat és más objektumokat tartalmaznak. Kódolásuk HTML (Hypertext

Részletesebben

HTML szerkesztés. HTML bevezetés

HTML szerkesztés. HTML bevezetés HTML szerkesztés HTML bevezetés Az internet fogalma: egy világméretű számítógép-hálózat, amely kisebb hálózatok összekapcsolódásából áll össze, a hálózatok hálózata, mely adatok továbbítását teszi lehetővé

Részletesebben

Webszerkesztés stílusosan. Készítette: Csécsy László Virgina DeBolt hasonló c. könyve alapján

Webszerkesztés stílusosan. Készítette: Csécsy László Virgina DeBolt hasonló c. könyve alapján Webszerkesztés stílusosan Készítette: Csécsy László Virgina DeBolt hasonló c. könyve alapján Tartalom HTML és CSS HTML vs. XHTML, CSS mi micsoda? XHTML nyelvtan: címkék, egyéb követelmények CSS nyelvtan:

Részletesebben

HTML alapok 1. Minimális HTML file: <HTML> <HEAD> <TITLE> cím </TITLE> </HEAD> <BODY>... </BODY> </HTML> Formátum parancsok:

HTML alapok 1. Minimális HTML file: <HTML> <HEAD> <TITLE> cím </TITLE> </HEAD> <BODY>... </BODY> </HTML> Formátum parancsok: HTML alapok 1 Minimális HTML file: cím ... Formátum parancsok: dőlt szöveg félkövér aláhúzott új sor vízszintes vonal

Részletesebben

HTML sablon tervezése

HTML sablon tervezése 3. Laboratóriumi gyakorlat HTML sablon tervezése A gyakorlat célja: Egy összefüggő HTML illetve CSS nyelvet használó oldal tervezése, amely később sablonként is használható. Felkészüléshez szükséges anyagok:

Részletesebben

Tájékoztató. Használható segédeszköz: -

Tájékoztató. Használható segédeszköz: - A 35/2016. (VIII. 31.) NFM rendelet szakmai és vizsgakövetelménye alapján. Szakképesítés, azonosító száma és megnevezése 54 481 06 Informatikai rendszerüzemeltető Tájékoztató A vizsgázó az első lapra írja

Részletesebben

Lássuk, mik azok a szempontok, amelyeket be kell tartanunk egy HTML kód írásánál:

Lássuk, mik azok a szempontok, amelyeket be kell tartanunk egy HTML kód írásánál: HTML 5 alapismeretek Bevezetés a HTML 5-be Mi is az a HTML? A HTML (HyperText Markup Language = hiperszöveges jelölőnyelv) egy leíró nyelv, amelyet direkt a weblapok létrehozására fejlesztettek ki, valamint

Részletesebben

Weblap készítése. Fapados módszer

Weblap készítése. Fapados módszer Weblap készítése Fapados módszer A számítógép beállítása Ha a kiterjesztések nem látszanak, akkor a következőt kell tennünk: A számítógép beállítása Ha a kiterjesztések nem látszanak, akkor a következőt

Részletesebben

Webkezdő. A modul célja

Webkezdő. A modul célja Webkezdő A modul célja Az ECDL Webkezdő modulvizsga követelménye (Syllabus 1.5), hogy a jelölt tisztában legyen a Webszerkesztés fogalmával, és képes legyen egy weboldalt létrehozni. A jelöltnek értenie

Részletesebben

A webprogramozás alapjai. Óbudai Egyetem Neumann János Informatikai Kar 2018/19/1 szemeszter

A webprogramozás alapjai. Óbudai Egyetem Neumann János Informatikai Kar 2018/19/1 szemeszter 1 A webprogramozás alapjai Óbudai Egyetem Neumann János Informatikai Kar 2018/19/1 szemeszter IV. előadás Nyelv típusok HTML nyelv fontosabb elemei I. Mappaszerkezet és file struktúra Szerkesztők bemutatása,

Részletesebben

Honlapkészítés. 1. Előadás Bevezető, HTML. Paksy Patrik

Honlapkészítés. 1. Előadás Bevezető, HTML. Paksy Patrik Honlapkészítés 1. Előadás Bevezető, HTML Paksy Patrik Miből áll össze egy honlap? Oldal szerkezete Grafika Tartalom Tervezzünk 800*600-as / 1024*768-as képfelbontásra! Ezek a ma használt legkisebb méretek!

Részletesebben

HTML. Szerkesszünk honlapot.. az alapoktól

HTML. Szerkesszünk honlapot.. az alapoktól HTML Szerkesszünk honlapot.. az alapoktól HTML A www jelentése World Wide Web. A HTML (angolul: HyperText Markup Language=hiperszöveges jelölőnyelv) egy leíró nyelv, melyet weboldalak készítéséhez fejlesztettek

Részletesebben

WEBSZERKESZTÉS ELMÉLETI VIZSGAKÉRDÉSEK

WEBSZERKESZTÉS ELMÉLETI VIZSGAKÉRDÉSEK ECDL Webszerkesztés, syllabus 2.0 WEBSZERKESZTÉS ELMÉLETI VIZSGAKÉRDÉSEK 1. Mi az FTP? a) Az FTP a multimédiás dokumentumok leíró nyelve. b) Az FTP a weboldalon lévő kattintható elem, amellyel egy másik

Részletesebben

Számológép. Bármilyen számítógépen működik, amin található böngésző és Java alkalmazás. Indító képernyő

Számológép. Bármilyen számítógépen működik, amin található böngésző és Java alkalmazás. Indító képernyő Felhasználói dokumentáció Számológép Feladat: JavaScript és CSS segítségével számológép készítése. Futtatási környezet: A http://10.0.0.101/~szabby/szgep.html linkre kattintva megjelenik az oldal. Az oldal

Részletesebben

Készítette: Gál Tamás. A tananyag programozott változata itt érhető el: Webfejlesztés

Készítette: Gál Tamás. A tananyag programozott változata itt érhető el: Webfejlesztés HLTML 5 alapok gyorstalpaló Készítette: Gál Tamás A tananyag programozott változata itt érhető el: Webfejlesztés (http://webfejlesztes.gtportal.eu/) Creative Commons Nevezd meg!-ne add el!-így add tovább!

Részletesebben

Oktatási segédanyag. Weboldalszerkesztési gyakorlatok

Oktatási segédanyag. Weboldalszerkesztési gyakorlatok Oktatási segédanyag Weboldalszerkesztési gyakorlatok Bevezetés A korábbi oktatási segédanyagokban megismertük a weboldalszerkesztés gyakorlatát. Ennek a segédanyagnak a célja, hogy gyakorlati példákon

Részletesebben

HTML. Dr. Nyéki Lajos 2016

HTML. Dr. Nyéki Lajos 2016 HTML Dr. Nyéki Lajos 2016 HTML és SGML HTML (Hypertext Markup Language) SGML (Standard Generalized Markup Language) ISO 8879:1986 A HTML nyelven készült dokumentumok kiterjesztése - az Internet szerveren:.html;

Részletesebben

Az MS Word szövegszerkesztés modul részletes tematika listája

Az MS Word szövegszerkesztés modul részletes tematika listája Az MS Word szövegszerkesztés modul részletes tematika listája A szövegszerkesztés alapjai Karakter- és bekezdésformázás Az oldalbeállítás és a nyomtatás Tabulátorok és hasábok A felsorolás és a sorszámozás

Részletesebben

Memória játék. Felhasználói dokumentáció

Memória játék. Felhasználói dokumentáció Memória játék Felhasználói dokumentáció Feladat: JavaScript segítségével, olyan programot írni, mely összekeveri a lapokat, majd a felhasználónak kell párosítani. HTML oldalba ágyazva és CSS-el formázva.

Részletesebben

Villamosmérnöki szak Alkalmazott informatika mellék szakirány Laboratórium II. (VIAU5102) World Wide Web lapok készítése (Silabusz)

Villamosmérnöki szak Alkalmazott informatika mellék szakirány Laboratórium II. (VIAU5102) World Wide Web lapok készítése (Silabusz) Villamosmérnöki szak Alkalmazott informatika mellék szakirány Laboratórium II. (VIAU5102) World Wide Web lapok készítése (Silabusz) HTML (Hyper Text Markup Language)...2 A HTML dokumentumokról...2 Néhány

Részletesebben

Széchenyi István Egyetem. Műszaki Tudományi Kar. Informatikai és Villamosmérnöki Intézet Távközlési Tanszék. Villamosmérnöki szak HTML

Széchenyi István Egyetem. Műszaki Tudományi Kar. Informatikai és Villamosmérnöki Intézet Távközlési Tanszék. Villamosmérnöki szak HTML Széchenyi István Egyetem Műszaki Tudományi Kar Informatikai és Villamosmérnöki Intézet Távközlési Tanszék Villamosmérnöki szak HTML HTML segédlet számítógép hálózatok tárgy gyakorlatához A jegyzet teljes

Részletesebben

Webshop készítése ASP.NET 3.5 ben I.

Webshop készítése ASP.NET 3.5 ben I. Webshop készítése ASP.NET 3.5 ben I. - Portál kialakíása - Mesteroldal létrehozása - Témák létrehozása Site létrehozása 1. File / New Web site 2. A Template k közül válasszuk az ASP.NEt et, nyelvnek (Language)

Részletesebben

CSS3 alapismeretek. Bevezetés a CSS-be. Mi is az a CSS? Alkalmazási formái, szintaxisa

CSS3 alapismeretek. Bevezetés a CSS-be. Mi is az a CSS? Alkalmazási formái, szintaxisa CSS3 alapismeretek Bevezetés a CSS-be Mi is az a CSS? A CSS az angol Cascading Style Sheets kifejezés rövidítése, ami magyarul talán egymásba ágyazott stíluslapoknak lehetne fordítani. Hasonlóan a HTML-hez,

Részletesebben

HTML ALAPOK. Abonyi-Tóth Andor, ELTE IK

HTML ALAPOK. Abonyi-Tóth Andor, ELTE IK HTML ALAPOK Abonyi-Tóth Andor, ELTE IK Fontos szabványok HTTP protokoll Protokoll = szabályrendszer HTTP HyperText Transfer Protocol (Hiperszöveg Átviteli Protokoll) a webböngésző (kliens) adatokat kérhet

Részletesebben

HTML és CSS. Horváth Árpád május 6. Óbudai Egyetem Alba Regia M szaki Kar (AMK) Székesfehérvár

HTML és CSS. Horváth Árpád május 6. Óbudai Egyetem Alba Regia M szaki Kar (AMK) Székesfehérvár Óbudai Egyetem Alba Regia M szaki Kar (AMK) Székesfehérvár 2015. május 6. Vázlat 1 2 A világháló Története statikus és dinamikus oldal URL DNS-feloldás IP-cím ügyfél (kliens, böngész ) és szerver (kiszolgáló)

Részletesebben

Természetesen készíts egy csempe nevű könyvtárat és ide mentsd az index.html állományt.

Természetesen készíts egy csempe nevű könyvtárat és ide mentsd az index.html állományt. Csempe kalkula tor A küldetésünk az, hogy segítsünk kiszámítani egy fürdőszoba csempeszükségletét (felületét). Sőt, ha a kalkulátort használó ügyfél elégedett egyből elküldheti az e-mail címét, hogy a

Részletesebben

A HTML dokumentum felépítése <BODY> </BODY>

A HTML dokumentum felépítése <BODY> </BODY> A HTML dokumentum felépítése Minden HTML formátumú szövegfájl a és a utasításokkal közrezárt részében tartalmazza a megjelenítendő részét. (A dokumentum-kereteket kivéve!) Ezen elemek között

Részletesebben

HTML ÉS PHP ŐSZI FÉLÉV

HTML ÉS PHP ŐSZI FÉLÉV 1 HTML ÉS PHP ŐSZI FÉLÉV 2012-10-10 CSS kezdőlépések 2 A CSS és a HTML viszonya 2012-10-10 Hol található CSS kód? 3 Közvetlenül a tag-ek style paraméterében: bekezdés Ekkor a

Részletesebben

Informatika 1. Informatika el adás. Kovács Kristóf, Pálovics Róbert. Budapesti M szaki Egyetem november 5.

Informatika 1. Informatika el adás. Kovács Kristóf, Pálovics Róbert. Budapesti M szaki Egyetem november 5. 8. el adás Kovács Kristóf, Pálovics Róbert Budapesti M szaki Egyetem 2013. november 5. Amit megtanulunk HTML alapok CSS alapok Amit megtanulunk HTML alapok CSS alapok A tanítottak alapján a saját honlapotokat

Részletesebben

A HONALPSZERKESZTÉS ALAPJAI. 50 feladat. a Debreceni Egyetem Informatikai Karának. Informatikus Könyvtáros szakos hallgatói számára

A HONALPSZERKESZTÉS ALAPJAI. 50 feladat. a Debreceni Egyetem Informatikai Karának. Informatikus Könyvtáros szakos hallgatói számára A HONALPSZERKESZTÉS ALAPJAI 50 feladat a Debreceni Egyetem Informatikai Karának Informatikus Könyvtáros szakos hallgatói számára Készítette: Jávorszky Ferenc Debrecen 2010. 1 1. Készítsen honlapot, amelynek

Részletesebben

3. modul - Szövegszerkesztés

3. modul - Szövegszerkesztés 3. modul - Szövegszerkesztés Érvényes: 2009. február 1-jétől Az alábbiakban ismertetjük a 3. modul (Szövegszerkesztés) syllabusát, amely a gyakorlati vizsga alapját képezi. A modul célja Ezen a vizsgán

Részletesebben

Webprogramozás szakkör

Webprogramozás szakkör Webprogramozás szakkör Előadás 3. (2013.03.19) Bevezető HTML felelevenítés HTML elemei Tag-ek, például: , , , Tulajdonságok, például: size, bgcolor Értékek, például: 4, black, #FFFFF

Részletesebben

Segédanyag a WORD használatához

Segédanyag a WORD használatához Segédanyag a WORD használatához Tartalom Kezdőlap:... 2 Beszúrás... 3 Tervezés... 3 Lapelrendezés... 4 Hivatkozás... 4 Objektumok saját menüi... 5 Táblázat... 5 Képek... 5 Alakzatok... 5 Menün kívüli tudnivalók

Részletesebben

Tartalomjegyzék BEVEZETÉS... IX WEBSZERKESZTÉSI ALAPISMERETEK HTML. 1. II. Háttér beállítása I. Elsõ weblapunk III. Karakterformázás...

Tartalomjegyzék BEVEZETÉS... IX WEBSZERKESZTÉSI ALAPISMERETEK HTML. 1. II. Háttér beállítása I. Elsõ weblapunk III. Karakterformázás... Tartalomjegyzék BEVEZETÉS.............. IX Kedves Olvasó.................... ix Kedves érettségizõ!................. x A mintafeladatok használata......... x WEBSZERKESZTÉSI ALAPISMERETEK HTML. 1 I. Elsõ

Részletesebben

Információs technológiák 2. Gy: CSS, JS alapok

Információs technológiák 2. Gy: CSS, JS alapok Információs technológiák 2. Gy: CSS, JS alapok 1/69 B ITv: MAN 2017.10.01 Ismétlés Van egy Web nevű mappánk, ebben vannak az eddig elkészített weboldalak (htm, html) képek (jpg, png). Logikai felépítés

Részletesebben

A Nobel díj története és a magyar fizikai Nobel díjasok

A Nobel díj története és a magyar fizikai Nobel díjasok 1. feladat A Nobel díj története és a magyar fizikai Nobel díjasok A weblapok híres magyar tudósok fényképeit és rövid életrajzukat kell, hogy tartalmazzák. A tudosok könyvtárban találod a meg a képeket

Részletesebben

HTML, XML szerkesztés

HTML, XML szerkesztés HTML, XML szerkesztés Vezető: Majzik Zsuzsa Előadó: Rigó Ernő http://gdf.tricon.hu/html Előzmények 1960-as évek: GML IBM SGML Standard Generalized Markup Language 1986-os

Részletesebben

Gazdasági informatika

Gazdasági informatika Gazdasági informatika Nyugat-Magyarországi Egyetem Faipari Mérnöki Kar Informatikai és Gazdasági Intézet Soós Sándor 2007. november 22-23. Internet - HTML Gazdasági informatika I. Soós Sándor 1 Napjaink

Részletesebben

Tájékoztató. Használható segédeszköz: -

Tájékoztató. Használható segédeszköz: - A 35/2016. (VIII. 31.) NFM rendelet szakmai és vizsgakövetelménye alapján. Szakképesítés, azonosítószáma és megnevezése 54 213 05 Szoftverfejlesztő Tájékoztató A vizsgázó az első lapra írja fel a nevét!

Részletesebben

Tájékoztató. Használható segédeszköz: -

Tájékoztató. Használható segédeszköz: - A 12/2013. (III. 29.) NFM rendelet szakmai és vizsgakövetelménye alapján. Szakképesítés, azonosítószáma és megnevezése 54 481 06 Informatikai rendszerüzemeltető Tájékoztató A vizsgázó az első lapra írja

Részletesebben

Információs technológiák 1. Gy: HTML alapok

Információs technológiák 1. Gy: HTML alapok Információs technológiák 1. Gy: HTML alapok 1/53 B ITv: MAN 2017.09.28 Hogyan kezdjünk hozzá? Készítsünk egy mappát, legyen a neve mondjuk: Web Ez lesz a munkakönyvtárunk, ide kerül majd minden létrehozott

Részletesebben

TABULÁTOROK TÁBLÁZATOK KÉSZÍTÉSE. A táblázatok készítésének lehetőségei:

TABULÁTOROK TÁBLÁZATOK KÉSZÍTÉSE. A táblázatok készítésének lehetőségei: TABULÁTOROK A tabulátorokat a szavak soron belüli pontos pozicionálására használjuk. A tabulátorokat valamilyen pozícióhoz kötjük. A pozíciók beállíthatók vonalzón vagy a Formátum menü Tabulátorok menüpontjának

Részletesebben

Webes alkalmazások fejlesztése 4. előadás. Megjelenítés és tartalomkezelés (ASP.NET) Cserép Máté.

Webes alkalmazások fejlesztése 4. előadás. Megjelenítés és tartalomkezelés (ASP.NET) Cserép Máté. Eötvös Loránd Tudományegyetem Informatikai Kar Webes alkalmazások fejlesztése 4. előadás (ASP.NET) Cserép Máté mcserep@inf.elte.hu http://mcserep.web.elte.hu Készült Giachetta Roberto jegyzete alapján

Részletesebben

Számítógép Architektúrák. 3. Gyakorlat (shell és HTML alapok)

Számítógép Architektúrák. 3. Gyakorlat (shell és HTML alapok) Számítógép Architektúrák 3. Gyakorlat (shell és HTML alapok) Gyakorlati feladatok 1 3. gyakorlat feladatai: 1. és 2. bekezdés Eredeti: Google: Linux:Könyvtár és fájlkezelés http://wiki.koczka.hu/index.php/linux:k%c3%

Részletesebben

HTML alapok. HTML = HyperText Markup Language

HTML alapok. HTML = HyperText Markup Language HTML = HyperText Markup Language HTML alapok A HTML jelölő nyelv, ami azt jelenti, hogy jelölőelemek (tag-ek) segítségével lehet a tartalom megformázására, elrendezésére vonatkozó utasításokat a böngésző

Részletesebben

Egyszerűbb a Google keresőbe beírni a Sharepoint Designer 2007 letöltés kulcsszavakat és az első találat erre a címre mutat.

Egyszerűbb a Google keresőbe beírni a Sharepoint Designer 2007 letöltés kulcsszavakat és az első találat erre a címre mutat. A feladat megoldásához a Sharepoint Designer 2007 programot használjuk, mely ingyenesen letölthető a Microsoft weboldaláról. Az érettségi aktuális szoftverlistája alapján az Expression Web 2, az Expression

Részletesebben

2008/09 ősz 1. Word / Excel 2. Solver 3. ZH 4. Windows 5. Windows 6. ZH 7. HTML - CSS 8. HTML - CSS 9. ZH 10. Adatszerkezetek, változók, tömbök 11. Számábrázolási kérdések 12. ZH 13. Pótlás Alapfogalmak

Részletesebben

Weblapok az érettségin. 2. feladat: weblap vagy prezentáció és grafika 30 pont

Weblapok az érettségin. 2. feladat: weblap vagy prezentáció és grafika 30 pont Weblapszerkesztés Weblapok az érettségin 2. feladat: weblap vagy prezentáció és grafika 30 pont Weblapszerkesztők MS Front Page MS Share Point Designer Macromedia Dreamwaver Mozilla Composer / NVU / Kompozer

Részletesebben

Akadálymentes weboldalkészítés dióhéjban

Akadálymentes weboldalkészítés dióhéjban Akadálymentes weboldalkészítés dióhéjban Készítette: Mezei Ádám Info-kommunikációs Akadálymentességi Műhelykonferencia 2008. november 20 Mi az oka, hogy NEM akadálymentes honlapokat készítünk? 1) Nem gondolunk

Részletesebben

Bevezetés az SPSS program használatába

Bevezetés az SPSS program használatába Bevezetés az SPSS program használatába Statisztikai szoftver alkalmazás Géczi-Papp Renáta SPSS alapok Statistical Package for Social Sciences SPSS nézetek: Data View Variable View Output Viewer Sintax

Részletesebben

Webes alkalmazások fejlesztése 4. előadás. Megjelenítés és tartalomkezelés (ASP.NET)

Webes alkalmazások fejlesztése 4. előadás. Megjelenítés és tartalomkezelés (ASP.NET) Eötvös Loránd Tudományegyetem Informatikai Kar Webes alkalmazások fejlesztése 4. előadás (ASP.NET) 2016 Giachetta Roberto groberto@inf.elte.hu http://people.inf.elte.hu/groberto Nézetek kezelése Sok esetben

Részletesebben

(statikus) HTML (XHTML) oldalak, stíluslapok

(statikus) HTML (XHTML) oldalak, stíluslapok (statikus) HTML (XHTML) oldalak, stíluslapok Áttekintés A HTML története HTML oldal felépítése Egymásba ágyazható stíluslapok CSS Áttekintés A HTML története HTML oldal felépítése Egymásba ágyazható stíluslapok

Részletesebben

Táblázatok kezelése. 1. ábra Táblázat kezelése menüből

Táblázatok kezelése. 1. ábra Táblázat kezelése menüből Táblázat beszúrása, létrehozása A táblázatok készítésének igénye már a korai szövegszerkesztőkben felmerült, de ezekben nem sok lehetőség állt rendelkezésre. A mai szövegszerkesztőket már kiegészítették

Részletesebben

A HTML Stuktúra. Betűtípusok, stílusok <b> <i> <u> <tt> Bevezetés. <b>kövér betűk (bold) </b> Dőlt betűk (italic) <i>dőlt betűk (italic)</i>

A HTML Stuktúra. Betűtípusok, stílusok <b> <i> <u> <tt> Bevezetés. <b>kövér betűk (bold) </b> Dőlt betűk (italic) <i>dőlt betűk (italic)</i> Bevezetés Utolsó módosítás: 11/22/2004 13:0 A HTML Stuktúra Amint a bevezetőben olvashattuk, minden HTML formátumú szövegfájl a utasítással kezdődik és a utasítással végződik. A dokumentumot

Részletesebben

Word V. tabulátortípus meg nem jelenik: Tabulátor - balra, Tabulátor - jobbra,

Word V. tabulátortípus meg nem jelenik: Tabulátor - balra, Tabulátor - jobbra, Word V. Tabulátorok A tabulátorok (tabulátorhely: A vízszintes vonalzó azon pontja, amely meghatározza a szövegbehúzást, illetve a szövegoszlop kezdetét.), segítségével a szöveget balra, jobbra, középre,

Részletesebben

5-ös lottó játék. Felhasználói dokumentáció

5-ös lottó játék. Felhasználói dokumentáció 5-ös lottó játék Felhasználói dokumentáció Feladat: JavaScript és CSS segítségével 5-ös lottó játék készítése. Futtatási környezet: A http://10.0.0.101/~szabby/ linkre kattintva megjelenik az oldal. Az

Részletesebben

BEVEZETÉS A HTML NYELV HASZNÁLATÁBA

BEVEZETÉS A HTML NYELV HASZNÁLATÁBA BEVEZETÉS A HTML NYELV HASZNÁLATÁBA TARTALOM Bevezetı... 1 A HTML dokumentumok szerkezete... 1 Kezdjük a címmel... 1 Címsorok és bekezdések használata... 2 Színek és háttér... 2 Szövegrészek formázása...

Részletesebben

4. rész. HÁTTÉR BEÁLLÍTÁSA Egy pillanat alatt meg lehet változtatni egy oldal arculatát, ha megváltoztatjuk a háttérszínét.

4. rész. HÁTTÉR BEÁLLÍTÁSA Egy pillanat alatt meg lehet változtatni egy oldal arculatát, ha megváltoztatjuk a háttérszínét. HTML HÁTTÉR BEÁLLÍTÁSA, KÉPEK A WEBLAPON HIPERLINKEK, HIVATKOZÁSOK DOKUMENTUM ADOTT PONTJÁRA VALÓ UGRÁS 4. rész HÁTTÉR BEÁLLÍTÁSA Egy pillanat alatt meg lehet változtatni egy oldal arculatát, ha megváltoztatjuk

Részletesebben

Gyakorló 9. feladat megoldási útmutató

Gyakorló 9. feladat megoldási útmutató Gyakorló 9. feladat megoldási útmutató 1. Minek a leírása a következő? Aktív hálózati hardver eszközök (pl.: routerek) és szoftverek segítségével létrehozott biztonsági rendszer két hálózat (jellemzően

Részletesebben

Sakk játék. Feladat: JavaScript segítségével olyan programot kell írni, ami egy sakktáblát szimulál. Kiválasztásra változtatják a helyüket.

Sakk játék. Feladat: JavaScript segítségével olyan programot kell írni, ami egy sakktáblát szimulál. Kiválasztásra változtatják a helyüket. Sakk játék Felhasználói dokumentáció Feladat: JavaScript segítségével olyan programot kell írni, ami egy sakktáblát szimulál. Kiválasztásra változtatják a helyüket. Futtatási környezet: A http://10.0.0.101/~hgy/sakk/

Részletesebben

Feladatok megoldásai

Feladatok megoldásai 1. Az oszlopszélességet az oszlopszegélyre való dupla kattintással állítsuk be! Mit tapasztalunk? Az oszlopszegélyre való dupla kattintáskor az Excel az oszlopban található leghosszabb bejegyzés hosszúsága

Részletesebben

Weblapszerkesztési alapok

Weblapszerkesztési alapok Weblapszerkesztési alapok Az internet fogalma INTER NET: International Network = Nemzetközi számítógépes hálózat. A gyökerek az 1960-as évekig nyúlnak vissza, a történet katonai fejlesztések civil szférába

Részletesebben

A HTML ÉS A CSS ALAPJAI

A HTML ÉS A CSS ALAPJAI Dr. Öveges Ferenc A HTML ÉS A CSS ALAPJAI Segédlet a Lovassy László Gimnázium informatika tagozata számára Veszprém 2011. Tartalomjegyzék Bevezetés 6 1. Előzetes tudnivalók 6 1.1 A HTML és XHTML szabvány

Részletesebben

HTML parancsok (html tanfolyam témakörei)

HTML parancsok (html tanfolyam témakörei) HTML parancsok (html tanfolyam témakörei) 1. Bevezető HTML, HEAD, TITLE parancs 2. Karakter formázás: félkövér, dölt, aláhúzott, fejléc: H1, H2, h6 csökkenő betűméret új bekezdés, új

Részletesebben

(statikus) HTML (XHTML) oldalak, stíluslapok

(statikus) HTML (XHTML) oldalak, stíluslapok (statikus) HTML (XHTML) oldalak, stíluslapok Áttekintés A HTML története HTML oldal felépítése Egymásba ágyazható stíluslapok CSS Áttekintés A HTML története HTML oldal felépítése Egymásba ágyazható stíluslapok

Részletesebben

HTML. Ismerkedés a JavaScripttel. A JavaScript lehet ségei. A JavaScript kód helye. Önálló JavaScript fájlok

HTML. Ismerkedés a JavaScripttel. A JavaScript lehet ségei. A JavaScript kód helye. Önálló JavaScript fájlok HTML Ismerkedés a JavaScripttel webprogramozó A weblapokat HTML nyelven készíthetjük el. A HTML egyszer leírónyelv, nem alkalmas válaszolni a felhasználóknak, nem tud döntéseket hozni, nem tud végrehajtani

Részletesebben

A CorinMail hírlevélküldő rendszer szerkesztőfelületének használata:

A CorinMail hírlevélküldő rendszer szerkesztőfelületének használata: A CorinMail hírlevélküldő rendszer szerkesztőfelületének használata: CMS tartalom szerkesztő használata A CMS szerkesztő felületet alapvetően két nézetben tudjuk használni. Az alapbeállítás a vizuális

Részletesebben

Táblázatkezelés 2. - Adatbevitel, szerkesztés, formázás ADATBEVITEL. a., Begépelés

Táblázatkezelés 2. - Adatbevitel, szerkesztés, formázás ADATBEVITEL. a., Begépelés Táblázatkezelés 2. - Adatbevitel, szerkesztés, formázás ADATBEVITEL a., Begépelés Az adatok bevitelének legegyszerűbb módja, ha a táblázat kijelölt cellájába beírjuk őket. - számok (numerikus adatok) -

Részletesebben

TUDNIVALÓK A WEB-FEJLESZTÉS I. KURZUSRÓL

TUDNIVALÓK A WEB-FEJLESZTÉS I. KURZUSRÓL TUDNIVALÓK A WEB-FEJLESZTÉS I. KURZUSRÓL http://bit.ly/a1lhps Abonyi-Tóth Andor Egyetemi tanársegéd 1117, Budapest XI. kerület, Pázmány Péter sétány 1/C, 2.404 Tel: (1) 372-2500/8466 http://abonyita.inf.elte.hu

Részletesebben

Összetett feladatok. Föld és a Hold

Összetett feladatok. Föld és a Hold 1. feladat Összetett feladatok Föld és a Hold Készíts weblapot, ahol a Földet és a Holdat mutatod be! A weblaphoz tartozó nyers szöveg a fold.txt és a hold.txt tartalmazza. A forrásban megtalálod a fold.jpg

Részletesebben

Statikus és dinamikus weblapok

Statikus és dinamikus weblapok A statikus weblapok Statikus és dinamikus weblapok A honlapok lehetnek statikusak és dinamikusak. A statikus weblapok tartalma és forrás kódja állandó. A statikus weblapok létrehozására alkalmas a HTML

Részletesebben

Neumann János Számítógép-tudományi Társaság Programozás, robotprogramozás szakkör Három félév 3 * 8 foglalkozás

Neumann János Számítógép-tudományi Társaság Programozás, robotprogramozás szakkör Három félév 3 * 8 foglalkozás Neumann János Számítógép-tudományi Társaság Programozás, robotprogramozás szakkör Három félév 3 * 8 foglalkozás Első félév A modul időtartama: A modul célja: A modul tartalma: 8 foglalkozás, alkalmanként

Részletesebben

A statisztika alapjai - Bevezetés az SPSS-be -

A statisztika alapjai - Bevezetés az SPSS-be - A statisztika alapjai - Bevezetés az SPSS-be - Kvantitatív statisztikai módszerek Petrovics Petra, Géczi-Papp Renáta SPSS alapok Statistical Package for Social Sciences SPSS nézetek: Data View Variable

Részletesebben

Az MS Excel táblázatkezelés modul részletes tematika listája

Az MS Excel táblázatkezelés modul részletes tematika listája Az MS Excel táblázatkezelés modul részletes tematika listája A táblázatkezelés alapjai A táblázat szerkesztése A táblázat formázása A táblázat formázása Számítások a táblázatban Oldalbeállítás és nyomtatás

Részletesebben

Selteco Menu Maker 4

Selteco Menu Maker 4 Selteco Menu Maker 4 Felhasználói Kézikönyv 4.1.5 1999-2010 Selteco Software Minden jog fenntartva. www.selteco.hu Menu Maker 4 Kezdjük el...3 Menüelem hozzáadása...4 Almenü készítés...5 Menü exportálás...6

Részletesebben

Az Kompozer, illetve az NVU honlapszerkesztő program

Az Kompozer, illetve az NVU honlapszerkesztő program Az Kompozer, illetve az NVU honlapszerkesztő program A programról A program felülete A program indítása után a következő felület jelenik meg: A fenti képen bemutatott eszköztárakat a Nézet / Megjelenítés/Elrejtés

Részletesebben

qwertzuiopőúasdfghjkléáűíyxcvbnmq wertzuiopőúasdfghjkléáűíyxcvbnmq wertzuiopőúasdfghjkléáűíyxcvbnmq wertzuiopőúasdfghjkléáűíyxcvbnmq

qwertzuiopőúasdfghjkléáűíyxcvbnmq wertzuiopőúasdfghjkléáűíyxcvbnmq wertzuiopőúasdfghjkléáűíyxcvbnmq wertzuiopőúasdfghjkléáűíyxcvbnmq q HTML szerkesztés gyakorlat jegyzet 2010. április 4. Sallai András 2010 Készült az Oktatásért Közalapítvány támogatásával. Egressy Gábor Kéttannyelvű Műszaki Szakközépiskola Tartalom 1. Alap címkék...

Részletesebben

A Microsoft OFFICE. EXCEL táblázatkezelő. program alapjai. 2013-as verzió használatával

A Microsoft OFFICE. EXCEL táblázatkezelő. program alapjai. 2013-as verzió használatával A Microsoft OFFICE EXCEL táblázatkezelő program alapjai 2013-as verzió használatával A Microsoft Office programcsomag táblázatkezelő alkalmazása az EXCEL! Aktív táblázatok készítésére használjuk! Képletekkel,

Részletesebben

Stíluslapok használata (CSS)

Stíluslapok használata (CSS) 2. Laboratóriumi gyakorlat Stíluslapok használata (CSS) A gyakorlat célja: Bevezetés a CSS stíluslapok használatába. Felkészüléshez szükséges anyagok: 1. A 3-as segédlet (CSS) 2. A bibliográfia HTML illetve

Részletesebben

Informatika 1. Informatika el adás. Kovács Kristóf, Pálovics Róbert. Budapesti M szaki Egyetem november 13.

Informatika 1. Informatika el adás. Kovács Kristóf, Pálovics Róbert. Budapesti M szaki Egyetem november 13. Informatika 1 9. el adás Kovács Kristóf, Pálovics Róbert Budapesti M szaki Egyetem 2013. november 13. CSS HTML formázasára, elhelyezésére szolgál Cél az újrafelhasználhatóság és könny módosítás CSS kód

Részletesebben

HTML 5 - Start. Turóczy Attila Livesoft Kft

HTML 5 - Start. Turóczy Attila Livesoft Kft HTML 5 - Start Turóczy Attila Kft. 2010.11.01. HTML története A HTML az angol HyperText Markup Language szavak rövidítése. Alapvetően egy leírónyelv, ami weboldalak készítéséhez használunk. A HTML szöveges

Részletesebben

4. modul HTML ÉS TARTALOMFELTÖLTÉS 2009.

4. modul HTML ÉS TARTALOMFELTÖLTÉS 2009. I N F O R M A T I K A ALAP 4. modul HTML ÉS TARTALOMFELTÖLTÉS 2009. Copyright MaggaM Kft. 2009 Minden jog fenntartva Tartalomjegyzék: HTML alapok... 4 A HTML nyelv története... 5 A HTML nyelv szerkezete...

Részletesebben

Informatika 1 CSS. Kovács Kristóf, Pálovics Róbert, Wettl Ferenc november 4. Budapesti M szaki Egyetem

Informatika 1 CSS. Kovács Kristóf, Pálovics Róbert, Wettl Ferenc november 4. Budapesti M szaki Egyetem Informatika 1 CSS Kovács Kristóf, Pálovics Róbert, Wettl Ferenc Budapesti M szaki Egyetem 2014. november 4. CSS CSS: Cascading Style Sheets CSS CSS: Cascading Style Sheets Cél: a tartalom és a megjelenítés

Részletesebben

HVK Adminisztrátori használati útmutató

HVK Adminisztrátori használati útmutató HVK Adminisztrátori használati útmutató Tartalom felöltés, Hírek karbantartása A www.mvfportal.hu oldalon a bejelentkezést követően a rendszer a felhasználó jogosultsági besorolásának megfelelő nyitó oldalra

Részletesebben

Több oldalas dokumentum készítése. MS Word 2010 szövegszerkesztővel

Több oldalas dokumentum készítése. MS Word 2010 szövegszerkesztővel Több oldalas dokumentum készítése MS Word 2010 szövegszerkesztővel Egy többoldalas dokumentummal szemben támasztott követelmények (példa feladaton keresztül bemutatva) Készítsünk hat oldalas dokumentumot,

Részletesebben