HTML programozs az alapoktl

- 1. -

HTML programozs az alapoktl

rta: Vri Csaba2007. mrcius

- 2. -

HTML programozs az alapoktl

1. Mi az a HTML dokumentum?A HTML dokumentum egy standard szvegfjl .html vagy .htm kiterjesztssel, mely specilis formz utastsokat tartalmaz. (HTML = Hyper Text Markup Language) Legegyszerbben a Jegyzettmbbel hozhatjuk ltre, szerkeszthetjk s menthetjk el, de ajnlott valamilyen HTML szerkeszt program, pldul az EditPlus 2 hasznlata. Megjelentsre leggyakrabban az Internet Explorert, a Netscape-et, vagy a Firefox-ot hasznljuk de a standard HTML dokumentumot sok ms bngsz is rtelmezni tudja.

2. Mi az a TAG?A TAG (ejtsd: teg, a tovbbiakban egyszeren tag) a HTML dokumentumok formz utastsa. Minden estben a kisebb s a nagyobb relcis jelek kz kell tenni: Minden tag-nek van nyit s zr rsze. A zr rszben az azonost el egy / jelet kell tenni: A HTML 4.01-ben tag-eket rhatjuk kis s nagy betvel is a bngsz ugyangy kezeli majd mindkettt. A tag nyit rszbe az azonost utn megadhatunk gynevezett paramtereket is. Ezek a paramterek a tag-re vonatkoz tulajdonsgokat lltjk be. A paramter neve s az egyenlsgjel utn a paramter rtkt dupla idzjelek kz kell tenni. A paramtereket egy szkzzel vlasztjuk el egymstl. A knnyebb ttekinthetsg rdekben a legtbb HTML szerkeszt oldalhoz hasonl szneket hasznlunk a HTML kdoknl. A style paramter egy olyan specilis paramter, melyben tovbbi paramtereket adhatunk meg. A style rtkben a paramterek s rtkk kztt csak egy kettspontot kell rakni s az rtket a kvetkez paramtertl egy pontosvesszvel s szkzzel kell elvlasztani. A style-al tulajdonkppen a CSS -t hasznljuk, de erre most nem fogunk kitrni. A tag nyit s zr rsze kz kerl az a rsz, amelyre a tag vonatkozik. Ha pldul egy szveget kk sznnel s 5-s betnagysggal szeretnnk kirni: Ide jn s szveg...

HTML programozs az alapoktl

- 3. -

3. A HTML dokumentum alapszerkezeteMinden HTML oldal a kvetkezkppen pl fel: [..................] [..................] [..................] [..................] Jl lthat, hogy minden nyit tag-nek megvan a zr prja, s hogy mindig azt a tag-et zrjuk le elszr, amelyiket utoljra megnyitottuk. A HTML oldalak mind ilyen keretes szerkezetek! Nhny tag esetben a zr tag-et elhagyhatjuk, de erre majd mindig kln felhvom a figyelmet! Most vegyk sorra ezt a 4 alapvet tag-et: : : Azt jelzi, hogy a kzte lv szveget a HTML szabvny szerint kell rtelmeznie a bngsznek. Ennek a tag-nek nincsenek paramterei, s mindig ktelez lezrni. Ez a HTML oldal fejrsze. Sok hasznos informcit elhelyezhetnk benne, de egyelre mg csak a kvetkez tag-et tegyk bele:

: A HTML oldal cme, vagy ha gy tetszik fejlce, ami a bngsz fejlcben jelenik meg. Paramterei nincsenek, s mindig ktelez lezrni! : A HTML oldal trzse. A nyit s zr tag kz bert szveget a bngsz megprblja rtelmezni, majd megjelenteni. Mindig le kell zrni.

4. Megjegyzsek beszrsaA megjegyzs tag-et olyan szvegek elhelyezsre hasznljuk, melyet bngsz nem veszi figyelembe, nem jelent meg csak a szerkeszts kzben lehet r szksgnk:

- 4. -

HTML programozs az alapoktl

5. Az oldalunk specifikcijnak megadsaAz oldalunk specifikcija az els dolog amit HTML szerkesztsnl megadunk. Ezzel mondjuk meg a bngsznek, hogy melyik HTML specifikcit hasznlja a dokumentum. Hrom fajtja van: HTML Strict DTD : Szigor szabvnykvetshez hasznlatos DTD (dokumentumtpus definci - Document Type Definition). Megjelentsi hibk nem megengedettek. Hasznlhat stlus meghatrozsokkal (Cascading Style Sheets-CSS).

HTML Transitional DTD : A 'Transitional DTD'-vel meghatrozott weboldal tartalmazhat olyan paramtereket s tag-eket, amelyek a W3C szerint stlusmeghatrozsokkal helyettestendk. HTML Frameset DTD : A Frameset DTD hasznland keretes (frames) weboldalak esetn. A 'Frameset DTD' azonos a 'Transitional DTD'-vel, de itt a tag-et a tag helyettesti.

A HTML Strict DTD : A HTML Transitional DTD : A HTML Frameset DTD :

HTML programozs az alapoktl

- 5. -

6. A httr s a sznek belltsai6.1 Httr belltsaAz oldal httert s httrsznt a tag-ben lehet paramterknt megadni. Ha httrkpet is hasznlunk, akkor ajnlott a httrsznt a kphez hasonlra belltani, gy biztos nem lesz soha olvashatsgi problmnk (pldul, ha ki van kapcsolva a kpek letltse a bngszben). A httr sznt meg lehet adni a hexa kdjval (pl. #FF01DC) vagy ha van a rvid angol nevvel (pl. crimson): Ajnlott olyan httrkpet megadni, ami nem tlsgosan tarka, gy a szveg mindenhol jl olvashat lesz. A httrkpet relatv (pl.: images/hatter.jpg) s abszolt (pl.: http://valami.hu/konyvtar/hatter.jpg) linkkel is megadhatjuk: A httrkp tulajdonsgait a style paramterrel mdosthatjuk: A style-ba a kvetkez paramterek kerlhetnek: background-position: : A httrkp pozcijt hatrozhatjuk meg vele. left = balra, center = kzpre, right = jobbra Ha kisebb a kp mint a kpernynk, akkor mozaikszeren beillessze-e a kpet. A no-repeat rtkre csak egyszer illeszti be a kpet.

background-repeat: :

background-attachment: : A httrkp mozgatsa. Ha rtkknt fixed-et runk a httrkpnk az oldal grgetsnl sem fog elmozdulni.

6.2 A szvegek sznnek belltsaAz oldal szneit is a tag-be rt paramterekkel tudjuk belltani: text="XX" : link="XX" : Az oldalon lv szvegek alaprtelmezett sznnek megadsa. Az linkek alaprtelmezett sznnek megadsa.

vlink="XX" : A mr felkeresett linkek sznnek megadsa. alink="XX" Az aktv hivatkozsok sznnek megadsa.

- 6. -

HTML programozs az alapoktl

7. Httrzene belltsaHa meg szeretnnk adni az oldalunk httrzenjt, azt a rszben tehetjk meg a tagel. Paramterknt kell berni a zene elrsi tvonalt: Ha a loop rtke -1, akkor a zeneszmot a vgtelensgig fogja ismtelgetni. Ha valamilyen 0-nl nagyobb szmot runk be, akkor a megadott szmszor fogja megismtelni a zent.

8. Margk belltsaA margkat a httrhez hasonlan a tagban tudjuk a paramterekkel belltani: A margk belltsnl hasznlhat paramterek: topmargin="XX" : leftmargin="XX" : A fels s az als marg mrete pixelben. A jobb s a bal oldali marg mrete pixelben.

marginheight="XX" : Ugyanaz, mintha a topmargin-t hasznltuk volna. marginwidth="XX" : Ugyanaz, mintha a leftmargin-t hasznltuk volna.

HTML programozs az alapoktl

- 7. -

9. Bekezds, sortrs s szkz9.1 Bekezdsek ltrehozsaBekezdseket a (paragraph) tag-el tudunk ltrehozni. Mindig le kell zrni! Paramterknt azt szoktuk megadni, hogy a bekezdsen bell balra, kzpre vagy jobbra legyen igaztva a szveg (left = balra, center = kzpre, right = jobbra, justify = sorkizrt). A szveg helye A bekezdseinket a mr korbban megismert style paramterrel is formzhatjuk: A szveg helye A style-ban a kvetkez paramtereket adhatjuk meg: text-align:XX : A bekezds vizszintes igaztst adhatjuk meg. (left, right, center, justify) Behzs a szveg eltt. Pixelben kell megadni. Behzs a szveg utn. Pixelben kell megadni. Trkz a szveg fltt. Pixelben kell megadni. Trkz a szveg alatt. Pixelben kell megadni. Az els sor behzsa. Pixelben kell megadni. Sortvolsg. Szzalkban kell megadni, az egyszeres sortvolsg a 100%.

margin-left:XX : margin-right:XX : margin-top:XX : margin-bottom:XX : text-indent:XX : line-height:XX% :

9.2 Sortrs s mestersges szkzA HTML dokumentumban lv, egymst kvet szkzket a bngsz egyetlen szkznek fogja fel. Ugyanez a helyzet a sortrssel is: hiba kezdnk j sort a szvegszerkesztben, a bngsz csupn egy szkzt fog beilleszteni a sortrs helyre. Ahhoz teht, hogy igazi sortrst illetve sok egymst kvet szkzt helyezznk el a dokumentumban, specilis vezrl elemekre van szksgnk:
: Sortrs beszrsa. Nem kell lezrni!

: Egy mestersges szkz beszrsa, melyet mr megjelent a bngsz.

- 8. -

HTML programozs az alapoktl

10. A bettpusok mdostsaA szvegek bettpust gy tudjuk mdostani, hogy a szveget a tag kz rakjuk. Le kell zrni. A szveg helye A tag-be rhat paramterek: size="X" : A szveg szabvnymrett adhatjuk meg 1-7 -ig. 1 = 8 pt, 2 = 10pt, 3 = 12 pt, 4 = 14 pt, 5 = 18 pt, 6 = 24 pt, 7 = 36 pt

color="XX" : A szveg sznt adhatjuk meg a hexa kdjval (pl: #FF01DC) vagy rvid angol nevvel (pl: crimson). face="XX" : A szveg bettpust adhatjuk meg (pl. arial, vagy courier new). Csak alap bettpusokat adjunk meg, ami minden szmtgpen megtallhat.

A bettpust a tag s a style paramter segtsgvel is formzhatjuk: A szveg helye A style-ban megadhat paramterek: text-decoration:XX : rtkknt megadhatjuk: overline = flhzott blink = villog font-variant:small-caps : Kiskapitlis. font-transform:XX : rtkknt megadhatjuk: uppercase = nagybets capitalize = nagy kezdbets visibility:hidden : letter-spacing:XX : Rejtett. A szveg betkzt adhatjuk meg pt-ban. Pl. a 2 pt az ktszeresre srtett, a -2 pt a ktszeresre ritktott.

Lteznek gynevezett szvegformz tag-ek, melyek kz kell rni a szveget. Mindig le kell zrni ket! Szvegformz tag-ek: Flkvr Dlt Alhzott Kiemelt Als index Fels index Definci Vltoz Billentyzet thzott Minta Kd (Courier New font) Idzet, alrs Ugyanaz mint a HTML programozs az alapoktl- 9. -11. FejlcekAz elz fejezetekben mr megtudtuk, hogy lehet nagy s vastag betkkel fejlceket kszteni a WEB-oldalaink szmra. Ltezik azonban egy egyszerbb megolds is, a szabvnyos fejlcek hasznlata. Ehhez a ... tag-eket kell hasznlni, melyek kzl a H1 a legnagyobb, s a H6 a legkisebb: dvzllek az oldalamon! A fejlcet az align paramterrel formzhatjuk (left = bal, center = kzpre, right = jobbra, justify = sorkizrt): Ez egy kzpre igaztott fejlc12. ListkA HTML-ben hromfle listt hozhatunk ltre. A rendezett listt, a rendezetlen listt, s a defincis listt.12.1 A rendezett lista:Az els a rendezett, ms nven szmozott lista, angolul "ordered list". Innen ered az tag neve is: . A szmozott lista sorait az tag utn, kln sorokba kell rnunk: A lista 1. pontja A lista 2. pontja A lista 3. pontja Az tag-ben a kvetkez paramtereket adhatjuk meg: type="X" : A szmozs stlust llthatjuk be. Megadhat rtkek: 1 = szmokkal A = nagy betkkel a = kis betkkel I = nagy rmai szmokkal i = kis rmai szmokkal start="XX" : A kezd sorszmot adhatjuk meg vele.- 10. -HTML programozs az alapoktlAz egyes sorok jabb listkat is tartalmazhatnak, teht a listkat egymsba lehet gyazni. Ekkor rdemes az egyes szintekhez klnbz tpusokat rendelni: A lista 1. pontja A lista 1. alpontja A lista 2. alpontja A lista 3. alpontja A lista 2. pontja A lista 3. pontja 12.2 Rendezetlen lista:A listk msodik tpusa a rendezetlen, ms nven felsorolt lista, angolul "unordered list", amibl az tag neve is ered. Felptse hasonl a rendezett listhoz, csak annyiban klnbzik tle, hogy itt az egymsba gyazott szintek automatikusan ms jellst kapnak (teli kr, res kr, teli ngyzet): A lista 1. pontja A lista 1. alpontja A lista 2. alpontja A lista 3. alpontja A lista 3. alpontjnak 1. alpontja A lista 3. alpontjnak 2. alpontja A lista 2. pontja A lista 3. pontja Az tag-be megadhat paramterek: type="X" : A szmozs stlust llthatjuk be. Megadhat paramterek: circle = res kr disc = teli kr square = ngyzetHTML programozs az alapoktl- 11. -12.3 Defincis lista:A listkhoz tartozik ugyan, de kicsit eltr az elz tpusoktl az n. defincis lista, angolul "definition list". A tag-je: . A listn bell egy "szakasz" mindig kt rszbl ll: a meghatrozsbl ("definition term", azaz ) s a lersbl ("definition description", azaz ). Ezt a tpust akkor hasznljuk, ha kifejezseket szeretnnk megmagyarzni, vagy egy-egy rvidebb szveghez hosszabb megjegyzst kvnunk fzni. Szerkezete a kvetkez: 1. Fogalom Az 1. fogalom meghatrozsa. 2. fogalom A 2. fogalom meghatrozsa. - 12. -HTML programozs az alapoktl13. KpekA kp beszrshoz be kell rni az tag-et (nem kell lezrni) s benne paramterknt meg kell adni a kp elrsi tvonalt, ami lehet abszolt s relatv is: Az tag-ben megadhat paramterek: border="XX" : hspace="XX" : vspace="XX" : alt="XX" align="XX" A kp keretnek vastagsgt adhatjuk meg pixelben. A vzszintes trkzt adhatjuk meg pixelben. A fggleges trkzt adhatjuk meg pixelben. Egy alternatv szveget adhatunk meg, ami akkor jelenik meg, ha nem jelenthet meg a kp, vagy ha a kurzort a kp fltt tartjuk. A kp vzszintes igaztst adhatjuk meg. left = balra right = jobbra bottom = az alapvonalra middle = a kp kzepe lesz az alapvonalra illesztve top = a kp teteje a szveg tetejvel lesz egy vonalban width="XX" height="XX" A kp szlessget adhatjuk meg pixelben. A kp magassgt adhatjuk meg pixelben.A kpet style paramterrel is formzhatjuk. Megadhat paramterek: border-color:XX : float:XX : A kp keretnek sznt llthatjuk be a szoksos mdokon. A krbefuttats irnyt adhatjuk none = nincs krbefuttats meg: left = a kp bal oldralra kerl s a szveg jobbrl folyja krbe right = a kp jobb oldralra kerl s a szveg balrl folyja krbe vertical-align:XX : A fggleges igaztst adhatjuk baseline = az alapvonalhoz igazts meg: middle = a kp kzepe lesz az alapvonalra illesztve top = a kp teteje a szveg tetejvel lesz egy vonalban bottom = az alapvonalraHTML programozs az alapoktl- 13. -margin-left:XX : margin-right:XX : margin-top:XX :A kp bal oldali margjt adhatjuk meg pixelben A kp jobb oldali margjt adhatjuk meg pixelben A kp fels margjt adhatjuk meg pixelbenmargin-bottom:XX : A kp als margjt adhatjuk meg pixelben border-style:XX :A keret fajtjt adhatjuk meg: dotted = pontvonal dashed = szaggatott solid = folytonos double = dupla groove = bevgott ridge = kill inset = bemlytett outset = kidomborod14. Vzszintes elvlasztvonalVzszintes vonalat a tag-el lehet ltrehozni. Nem kell lezrni: A tag-be rt paramterekkel tudjuk vltoztatni a vzszintes vonal tulajdonsgait. A megadhat paramterek: color="XX" : width="XX" : size="XX" : align="XX" : A vonal sznt adhatjuk meg. A vonal szlessgt adhatjuk meg pixelben vagy szzalkban. A vonal vastagsgt adhatjuk meg pixelben. A vonal vzszintes igaztst adhatjuk meg. (left = balra, center = kzpre, right = jobbra) Ezzel megszntethetjk a vonal rnykolst.noshade :- 14. -HTML programozs az alapoktl15. Hivatkozsok s knyvjelzk15.1 HivatkozsokLinkeket az tag segtsgvel hozhatunk ltre. (Mindig le kell zrni!). Az tag-ben lv href paramterrel tudjuk megadni a hivatkozs cljt. Ez lehet abszolt vagy relatv hivatkozs is: Link szvege. Link szvege. A hivatkozs alaprtelmezetten ugyanabban az ablakban nylik meg, mint amiben van. Ezen a target paramterrel vltoztathatunk: Link szvege. A target-ben megadhat paramterek: _self : _top : _blank : _parent : Azonos keret. Teljes ablak. j ablak. Szlkeret.15.2 Knyvjelzk:Ha a weboldalunkon van egy nagyon hossz szveg, akkor annak ajnlott az elejre linkeket rakni, amik a szveg bekezdseire mutatnak. Ezt a knyvjelzkkel tehetjk meg. Ehhez elszr minden bekezdsnek egy azonostt (id) kell adnunk. Ezutn a hivatkozsunkban nem egy oldal cmt hanem a bekezds azonostjt adjuk meg. Ekkor a hivatkozsba runk egy #-et s a knyvjelz nevt (a bekezds azonostjt). 1. knyvjelz szvege 2. knyvjelz szvege 3. knyvjelz szvege .... .... .... HTML programozs az alapoktl- 15. -16. Idzetek, blokkok elklntseAz oldalon tallhat szvegeket a tag-el klnthetjk el egymstl. A tag-ek kz kerl szveg margja a jobb s bal oldalon is nagyobb lesz, s a szveg alatt s felett is kihagy egy sort a bngsz. ...Ide jn a szveg... 17. TblzatokTblzatokat a tag-el tudunk ltrehozni. Ezutn a tag-el ltrehozzuk a tblzat sorait, majd a tag-el a sort cellkra osztjuk. Ha egy cellba nem runk semmit, akkor a keret nem fog rendesen megjelenni. Ezrt az res cellkba mindig tegynk egy mestersges szkzt: Az els sor els cellja Az els sor msodik cellja A msodik sor els cellja A msodik sor msodik cellja A tag-ben megadhat paramterek: align="XX" : A vonal vzszintes igaztst adhatjuk meg. (left = balra, center = kzpre, right = jobbra) A szeglyek vastagsgt adhatjuk meg pixelben. A cellk kztt rs nagysga pixelben. A cellkon belli marg nagysga pixelben. A tblzat szlessgt adhatjuk meg pixelben vagy szzalkban. A tblzat magassgt adhatjuk meg pixelben vagy szzalkban. A tblzat httrsznt adhatjuk meg. A tblzat httrkpt adhatjuk meg.border="XX" : cellspacing="XX" : cellpadding="XX" : width="XX%" : height="XX%" : bgcolor="XX" : background="XX" :bordercolorlight="XX" : A keret vilgos rsznek sznt adhatjuk meg.- 16. -HTML programozs az alapoktlbordercolordark="XX" :A keret stt rsznek sznt adhatjuk meg.A style paramterrel tovbbi tulajdonsgokat adhatunk meg: border-width:XX : border-color:XX : cellpadding:XX : A tblzat kls szeglynek a vastagsgt adhatjuk meg pixelben. A tblzat kls szeglynek a sznt adhatjuk meg. A cellkon belli marg nagysga pixelben.A tag-en bell megadhat paramterek: align="XX" : A sor tartalmnak vzszintes igaztsa. (left = balra, center = kzpre, right = jobbra) A sor tartalmnak fggleges igaztsa. (top = fellre, middle = kzpre, bottom = alulra ) A sor httrsznt adhatjuk meg. A sor keretnek a sznt adhatjuk meg.valign="XX" :bgcolor="XX" : bordercolor="XX" :bordercolorlight="XX" : A sor keretnek a vilgos sznt adhatjuk meg. bordercolordark="XX" : A sor keretnek a stt sznt adhatjuk meg.A tag-en bell megadhat paramterek: align="XX" : A cella tartalmnak vzszintes igaztsa. left = balra center = kzpre right = jobbra valign="XX" : A cella tartalmnak fggleges igaztsa. top = fellre middle = kzpre bottom = alulra width="XX" : colspan="XX" : rowspan="XX" : height="XX" : background="XX" : bgcolor="XX" : bordercolor="XX" : A cella szlessgt adhatjuk meg. A cella hny cella helyt foglalja el vzszintesen. A cella hny cella helyt foglalja el fgglegesen. A cella magassgt adhatjuk meg. A cella httert adhatjuk meg. A cella httrsznt adhatjuk meg. A cella keretnek a sznt adhatjuk meg.HTML programozs az alapoktl- 17. -bordercolorlight="XX" : A cella keretnek a vilgos sznt adhatjuk meg. bordercolordark="XX" : A cella keretnek a stt sznt adhatjuk meg.18. KeretekA keretek segtsgvel egy bngszablakban tbb HTML oldalt is megjelenthetnk. Keretes oldalt ktflekppen hozhatunk ltre, kerettel s begyazott kerettel.18.1 Keretes szerkezet oldalakKeretes szerkezet oldalaknl elszr ltre kell hozni egy kln HTML oldalt mely a kereteket tartalmazza. Ebben az oldalban fog megnylni a tbbi oldal. A keretes szerkezet oldalunkat a tag-el hozhatjuk ltre. (Le kell zrni) A tag-en bell a kvetkez paramtereket kell megadni: cols="XX, XX, *" : A keretes oldal oszlopainak szlessge. Megadhatjuk pixelben s szzalkban is. Az egyik oszlop szlessgnek megadhatjuk a *-ot, gy az a keret kiegszti az oldal szlessgt 100%-ra.framespacing="XX" : A keretek kzti tvolsg pixelben. border="X" : bordercolor="XX" : A keretek kzt legyen-e kerete. (0 = nem, 1 = igen) A keret sznt adhatjuk meg.Miutn ltrehoztuk az oszlopokat, azokat sorokra oszthatjuk, szintn a tag-el. Ezt a tag-et viszont az oszlop kt tag-je kz kell rni! A tag-en ezt a paramtert kell megadni: rows="XX, XX, *" : Az oszlopok sorainak a magassga. Megadhatjuk pixelben s szzalkban is. Az egyik sor magassgnak megadhatjuk a *-ot, gy az a keret kiegszti az oldal magassgt 100%-ra. Ezutn az oszlopokban ltrehozott kereteket kell definilnunk. Ezt a tag-el tehetjk meg. A tag-en bell a kvetkez paramtereket kell megadni: name="XX" : src="XX" : A keret nevt adhatjuk meg. A keretben megjelentend oldal elrsei tvonala.frameborder="X" : A keretek kzt legyen-e keret. (0 = nem, 1 = igen) scrolling="XX" : Grgethet legyen-e a keret. (yes = igen, no = nem, auto = csak akkor grgethet, ha nem ltszik a teljes oldal)marginwidth=XX" : A keret jobb s bal oldali margja pixelben.- 18. -HTML programozs az alapoktlmarginheight=XX" : A keret fenti s lenti margja pixelben. A keretes szerkezet oldalnl a linkek ltalban egy msik keretben nylnak meg. Ezt gy tudjuk belltani, hogy a hivatkozs target paramterbe rtkknt a keret nevt adjuk meg. Plda egy keretes szerkezet oldalra: Log Men Fejlc FoldalLbjegyzet HTML programozs az alapoktl- 19. -18.2 Begyazott keretekAz elz pldban ltrehozott oldalt begyazott keretek segtsgvel is ltrehozhatjuk. Ehhez elszr a keretek szerkezethez hasonl tblzatot kell kszteni a mr tanult mdon. Miutn ltrehoztuk a tblzatot a tblzat celliban el kell kszteni a begyazott kereteket. Ezt az (inline frame) tag-el tehetjk meg. Az tag-be a kvetkez paramtereket kell megadni: name="XX" : src="XX" : width="XX" : height="XX" : frameborder="X" : A begyazott keret nevt adhatjuk meg. A begyazott keretben megjelentend oldal elrsei tvonala. A begyazott keret szlessge pixelben vagy szzalkban. A begyazott keret magassga pixelben vagy szzalkban. A begyazott keretnek legyen-e kerete. (0 = nem, 1 = igen)framespacing="XX" : A begyazott keret s a tartalma kzti tvolsg pixelben. scrolling="XX" : Grgethet legyen-e a keret. (yes = igen, no = nem, auto = csak akkor grgethet, ha nem ltszik a teljes oldal)marginwidth="XX" : A begyazott keret jobb s bal oldali margja pixelben. marginheight="XX" : A begyazott keret fenti s lenti margja pixelben. align="XX" : A begyazott keret igaztsa: left = balra, right = jobbra top = fellre texttop = szveg tetejhez middle = kzpen absmiddle = kzpvonalra baseline = alapvonalra bottom = alulra absbottom = szveg aljhoz center = kzpre- 20. -HTML programozs az alapoktlEgy plda begyazott keretek hasznlatra: Men 1
Men 2 19. rlapokAz rlap tartalmazhat lthat, s nem lthat (rejtett) elemeket. Lthat elemek pldul a szvegbeviteli mezk, legrdl listk, s a gombok, mg a rejtett elemekben olyan informcikat trolhatunk, amelyekre az rlap feldolgozsakor szksgnk lehet, de nem szeretnnk, ha az rlapot kitlt szemly tudomsra jutna. Miutn az rlapot kitltttk, elkldjk egy feldolgoz programnak. Ez a feldolgoz program egyesvel beolvassa az rlap elemeit s rtkeiket, majd elvgzi rajtuk az ltalunk megadott utastsokat. Pldul eltrolhatjuk az adatokat egy adatbzisban, brmilyen formban kirathatjuk az adatokat a kpernyre, vagy akr el is kldhetjk az adatokat egy email cmre. Az rlapot a tag-ek kz kell rni. Amit ezen bell runk, az az rlap rsze lesz. A tag-ben megadhat paramterek action="XX.XXX" : A feldolgoz oldal neve, ami HTML vagy CGI oldal. method="XXX" : name="XX" : Az rlap elemeinek tadsi mdja. (GET vagy POST) Az rlap nevt adhatjuk meg.19.1 Szveges beviteli mezk s jelsz mezkSzveges beviteli mezt az tag-el hozhatunk ltre. Nem kell lezrni. Jelsz mezt az tag-el hozhatunk ltre. Ugyanaz mint a szveges mez, csak a bert szvegbl csak csillagok vagy krk ltszanak: HTML programozs az alapoktl- 21. -Megadhat paramterek: size="XX" : value="XX" : name="XX" : A szveges beviteli mez hosszt adhatjuk meg. A szveges beviteli mez alaprtke. A beviteli mez neve.maxlength="XX" : A maximlisan berhat karakterek szmt adhatjuk meg. disabled : A mez rvnytelentse. Ha a tag-be rjuk, nem lehet rni a mezbe.19.2 Rejtett mezkRejtett mezt a tag-el hozhatunk ltre. A value paramterbe rjuk azt az rtket, amira a feldolgozprogramnak szksge lesz: 19.3 Kijell ngyzetekA kijell ngyzet az tag-el hozhatunk ltre. Nem kell lezrni. A ngyzetek kzl brmelyiket kivlaszthatjuk (akr az sszeset is), de resen is hagyhatjuk ket. Ha tbb meznek ugyanazt a nevet adjuk, a form feldolgozsakor a kivlasztott mezk rtkeit vesszvel elvlasztva kapjuk vissza. Teht a mezk rtkei a feldolgozs utn (ha mindet kivlasztottuk): Megadhat paramterek: value="XX" : A kijell ngyzet rtke. name="XX" : A kijell ngyzet neve. checked : disabled : A kijell ngyzet kivlasztsa. Ha a tag-be rjuk, a ngyzet alaprtelmezetten ki lesz vlasztva. A ngyzet rvnytelentse. Ha a tag-be rjuk, nem lehet rkattintani.19.4 RdigombokA rdigombok hasonlak a kijellngyzetekhez, de a type paramterben radio -t kell rtkknt megadni. Ha ugyanazt a nevet adjuk nekik, akkor maximum egyet vlaszthatunk ki kzlk! A checked paramter megadsakor itt is alaphelyzetben ki lesz vlasztva az adott gomb. Ha tbb helyre is berjuk, hogy checked, akkor az utols lesz az rvnyes! A megadhat paramterek ugyanazok mint a kijell ngyzeteknl.- 22. -HTML programozs az alapoktl19.5 Gombok4 -fle gombot hozhatunk ltre az input tag-ben. 1. Egyszer gomb: Ennek a gombnak alaprtelmezetten nincs semmilyen funkcija, majd ksbb JavaScripttel lesz valami haszna. Az