Download - Szabad Muszaki Foiskola - Web Programozas
-
Szabadkai Mszaki Fiskola
WEB PROGRAMOZS
Szabadka
Mester Gyula, 2004.
-
2
Elsz
A kzirat a Web technolgik XHTML, CSS s PHP korszer tmakreinek alapjaival
foglalkozik. A tantrgy keretben a hallgatk megismerkednek a WEB programozs alapjaival,
nll feladatok megoldsn keresztl elsajttjk a WEB programozs, a dinamikus weboldalak
ksztsnek technikjt. Az XHTML s CSS fejldst a Word Wide Web Consortium (W3C, 1994) vllalta. A tmakrket
a szerz az 2002/2003. tanvtl kezdve oktatja. A tmakr feldolgozsa a nemzetkzi szakirodalom
utbbi vekben publiklt eredmnyein s a W3C ajnlsain alapszik. Az olvas a kziratban
szerepl ismeretek elsajttsval korszer tuds birtokba kerl, de szembe kell nzni azzal a
tnnyel is, hogy a tudsanyag rvid idn bell elavul. A kzirat elektronikus formban elrhet a
szerz honlapjn:
http://www.gmesterweb.com/e-tananyag
Az els tmakr az XHTML jellnyelv alapjaival foglalkozik s 14 fejezetbl ll. Az els fejezet
az XHTML alapfogalmaival, alapszablyaival s a dokumentumtpus defincikkal foglalkozik. A
kziratban az XHTML-1.0- Transitional DTD-t hasznljuk. Az XHTML dokumentumok alapszerkezete a msodik fejezet tartalma. A harmadik fejezetben
pedig XHTML nyelv attribtumait trgyaljuk. A szvegblokk XHTML formzsa a negyedik
fejezet tartalma. A szveges dokumentum XHTML sorformzsval pedig az tdik fejezetben
foglalkozunk. A hatodik fejezetben a hiperhivatkozsokat a hetedik fejezetben pedig a kpek
begyazst trgyaljuk. A nyolcadik fejezet a listk ltrehozsval foglalkozik. Kitrnk a: sorszm
nlkli listk, sorszmozott listk s a ler listk vizsglatra. A kilencedik fejezet az XHTML
tblzatokat, a tizedik fejezet pedig a kereteket trgyalja. A Java-appletek beillesztse az XHTML dokumentumba a tizenegyedik fejezetben tekintjk t. A
tizenkettedik fejezet pedig az XHTML rlapokkal foglalkozik. A kvetkez fejezet a begyazott,
kls szkriptekkel s az esemnyszkriptekkel foglakozik. Az utols fejezet az XHTML
kdrszletek ellenrzst mutatja be. A msodik tmakr az CSS (Cascading Style Sheet- lpcszetes stluslapok) alapjaival foglalkozik
s 5 fejezetbl ll. Az XHTML a dokumentum megjelentst a stluslapokra bzza. A stluslapok
segtsgvel az XHTML dokumentum szerzje a Web oldal minden megjelensbeli jellemzjt
bellthatja az ignyeknek megfelelen. A CSS specifikcinak tbb verzija ltezik. A mai
-
3
bngszk kezelni tudjk az els kt verzit (CSS1 s CSS2). A W3C jelenleg a harmadik verzi
fejlesztsn dolgozik (CSS3).
A bevezets utn a msodik fejezetben a beptett- s csatolt stluslapok felptst trgyaljuk. A
harmadik fejezet a stlusosztlyokkal foglalkozik. A negyedik fejezet ttekinti a szvegformzst
stluslapok alkalmazsval. Az tdik fejezet pedig a eltrszn httrszn tematikt trgyalja. A
tmakr vgn egy ellenrztt XHTML s CSS tfog feladatot mutatunk be. A knyvben
nagyszm pldt mutatunk be a Jegyzettmb s a megfelel bngszprogram felhasznlsval.
A harmadik tmakr a PHP alapjaival foglalkozik s 11 fejezetbl ll. Az alapfogalmak ttekintse
utn a PHP programfejleszts eszkzeit tekintjk t. Kvetkez fejezet tartalma programkszts a
PHP fejleszti krnyezetben. A negyedik fejezet a PHP nyelv alkotelemeit trgyalja. Az tdik
fejezet a vezrlszerkezetekkel foglalkozik, tartalma: feltteles utastsok, elgazsok,
ciklusszerkezetek.
A hatodik fejezetben a PHP fggvnyekkel foglalkozunk, majd az llomnyok begyazst s a
tmbk hasznlatt tekintjk t. A harmadik tmakr kilencedik fejezete a PHP s MySQL
adatbzis-kezelst trgyalja. Majd kln foglalkozunk a PHP szkriptek hozzfrs-korltozsval s
a MySQL, Apache s PHP teleptsvel s konfigurlsval.
Kln szeretnk ksznetet mondani a jegyzet lektornak Dr. Pletl Szilveszter fiskolai tanrnak.
Krem az olvaskat, hogy szrevteleiket a:
cmre juttassk el.
Szabadka, 2004. december. Mester Gyula
-
4
_______________________________________________________________________________
XHTML jellnyelv
________________________________________________________________________________
1. Az XHTML nyelv alapfogalmai 1.1 Bevezets Az XHTML (Extensible HyperText Markup Language) egy struktrban gazdag jellnyelv, amely
a megjelentst a stluslapokra bzza, modulris alapokra pl s egyttmkdik az XML
(Extensible Markup Language) alap felhasznli alkalmazsokkal. Az XHTML jellnyelv
megjelense s alkalmazsa az Internet fejldsnek egy fontos lpcsfokt jelenti. Az XHTML
fejldst a Word Wide Web Consortium (W3C, 1994) vllalta. A W3C ajnlsok formjban adja
ki s fejleszti az XHTML szabvnyait (http://www.w3.org). Az ajnlsokat s a szabvnyokat
munkacsoportok dolgozzk ki. gy elmondhat, hogy a HTML (HyperText Markup Language)
jellnyelv az SGML ( Standard Generalized Markup Language szabvnyostott ltalnos
jellnyelv) egy leegyszerstett rszhalmazaknt jtt ltre, a W3C pedig talaktotta a HTML-t
XHTML alkalmazss. A tovbbiakban az XHTML 1.0 SE (msodik kiads) verzijval
foglalkozunk (XHTML 1.0 ajnls: 2000. janur 26; fellvizsglva: 2002. augusztus 1.)
Az XHTM jellnyelv alkalmazsnak az elnyei a kvetkezk:
Az XHTML dokumentumok megfelelnek az XML kiterjeszthet jellnyelv elrsainak. Az XHTML dokumentumok kompatibilisek a HTML 4 jellnyelvben rt
dokumentumokkal.
Az XHTML dokumentumok alkalmazhatjk a szkripteket s appleteket. Az XHTML nyelv tisztbb s merevebb kdot biztost mint a HTML. Az XHTML jellnyelv tovbbfejldik (a HTML nem!), jelenleg az XHTML 2.0 verzi
fejlesztsnl tartunk.
Az XHTML dokumentumok elksztse szempontjbl a kvetkez eszkzkre lesz szksgnk:
-
5
a. Szvegszerkeszt A szvegszerkeszt az XHTML dokumentum megszerkesztsre szolgl. Megfelel brmilyen
egyszer szvegszerkeszt, amely formzs nlkli ASCII-szveget llt el, pldul a Jegyzettmb
(Notepad). Az XHTML dokumentum fejleszts leghatsosabb eszkze (a munka s a knyelem
szempontjbl) a:
Macromedia Dreamweaver MX 2004
hasznlata (rendelkezik kdsznezssel s kifejezs-szerkesztvel.)!
b. Webbngsz A bngsz az XHTML dokumentumok szmtgpen val megjelentsre szolgl program.
Clszer alkalmazni a szleskren hasznlt webbngszket mint pldul a:
Microsoft Internet Explorer
Netscape Navigator
Mozilla
Opera
1.2 Az XHTML jellnyelv alapszablyai Az XHTML jellnyelv alapszablyai kis szm, egyszer s jl rthet szintaktikai szablyokbl
ll: a.
Minden jellelem tartalmaz nyit- s zr jellelemet.
Teht minden megnyitott jellelemet be kell zrni! A nyit- s zr jellelem neve megegyez
kell, hogy legyen.
Helyes plda:
Internet alkalmazsfejleszts
Helytelen plda:
Internet alkalmazsfejleszts
b. Minden jellelem szablyosan egymsba gyazand.
Az egymsba gyazott jellelemeket a deklarls sorrendjvel ellenttesen kell lezrni. Teht az
utoljra megnyitott jellelem kerl elszr bezrsra. Helyes plda:
Nyugaton a helyzet vltozatlan Helytelen plda:
Nyugaton a helyzet vltozatlan
-
6
c. Az XHTML dokumentumok szablyosan formzandk.
Az XML ltal bevezetett j formzottsg kvetelmnyei:
- Az XHTML dokumentumban - gykr-jellelemet megelzen - DOCTYPE
(Document Type Definition dokumentumtpus- definci) deklarcit helyeznk el.
- A title dokumentumcm hasznlata ktelez.
- Az XHTML dokumentumban a:
gykr jellelem a legmagasabb szint jellelem.
- Az sszes (tetszleges szm) jellelemet a gykr jellelembe kell szablyosan
begyazni.
- Egy nyit- s zr jellelem kztt tetszleges szm tovbbi jellelemet (vagy
szveges adatot) helyezhetnk el. Az XHTML dokument alapfelptse a kvetkez:
...
1.1. kdrszlet Az XHTML dokument alapstruktrja A jl formzott XHTML dokumentum betartja az sszes XHTML szablyt! d.
A jellelem- s attribtumnevek kisbetvel randk.
Az XHTML jellelem- s attribtumnevek rzkenyek a kis s nagybetkre. Minden XHTML
jellelemet kisbetvel kell rni!
Helyes plda:
Leben und leben lassen Helytelen plda:
Leben und leben lassen
-
7
e. Az attribtum rtkeket mindig idzjelelek kzz randk.
A nyit jellelemben az attribtumok rtkeit mindig nyit- s zr idzjelek kztt szksges
megadni.
Helyes plda:
Helytelen plda:
f. Az res jellelemek per jellel (/) lezrandk.
Abban az esetben, ha az XHTML jellelemhez nem tartozik adat, a nyit- s zr jellelem
sszevonhat gy, hogy a perjelet a nyit jelljelem vgre helyezzk. Az res karakter (white
space) szkz megadsa a per jel (/) eltt ktelez!
Helyes plda:
Helytelen plda: g. Az attribtum-rtk prok teljessgkben kirandk.
Az XHTML nem tmogatja az attribtumok minimalizcijt! Helyes plda: Helytelen plda:
h.
A name attribtum helyett id attribtum hasznland.
Az XHTML-ben a name attribtumot lecserltk az id attribtummal! Helyes plda:
Helytelen plda:
1.3 Dokumentumtpus defincik A dokumentumban - gykr-jellelemet megelzen - DOCTYPE deklarcit kell elhelyezni. A
DTD dokumentumtpus definci (Document Type Definition), olyan XML lersok sszessge,
amelyek meghatrozzk a dokumentumtpus defincit hasznl dokumentum rvnyes struktrjt.
A DTD meghatrozza a dokumentum ltal elrhet jellelemeket s attribtumokat.
-
8
Az XHTML jellnyelvnl hrom tpus DTD-t ismernk:
a. XHTML-1.0-Strict
1.2. kdrszlet Az XHTML -1.0-Strict DTD
Az XHTML-1.0-Strict DTD (szigor megfelels dokumentumok) hasznlata akkor clszer ha
szigor jellnyelv struktrt hasznlunk s a megjelentst a stluslapokra bzzuk a CSS
technolgia alkalmazsval. Alkalmazsa esetben az XHTML dokumentumunk teljes egszben
megfelel a szabvnynak.
b. XHTML 1.0 Transitional
1.3. kdrszlet Az XHTML -1.0- Transitional DTD
Az XHTML-1.0- Transitional1 DTD (tmeneti dokumentumok) hasznlata akkor clszer, ha az
XHTML alkalmazsa mellet kompatibilitst szeretnnk elrni a meglv Weboldalakkal s a
rgebbi tpus bngszkkel.
c. XHTML 1.0 Frameset
1.4. kdrszlet Az XHTML -1.0- Frameset DTD
Az XHTML-1.0- Frameset DTD (keretes dokumentumok) hasznlata akkor clszer ha az XHTML
alkalmazsa mellet kompatibilitst szeretnnk elrni a HTML keretek alkalmazsval, amelyek a
Weblapot keretekre (rgikra) osztjk.
1 A knyv tovbbi rszben az XHTML-1.0- Transitional DTD-t hasznljuk.
-
9
2. Az XHTML dokumentumok alapszerkezete Egy XHTML dokumentum hrom szerkezeti egysgre bonthat:
a. Az els rsz egy deklarcis rsz, amely arrl ad informcit, hogy a dokumentumunk az XHTML nyelv melyik verzijban rdott:
2.1. kdrszlet Az XHTML dokument alapstruktrja
A deklarcis rsz els sora:
azt hatrozza meg, hogy a dokumentumunk egy XML dokument unicode (UTF-8) kdolssal.
A deklarcis rsz msodik sora:
meghatrozza, hogy a Weboldalunkon tmeneti DTD-t hasznlunk.
A deklarcis rsz harmadik sora:
meghatrozza, hogy itt kezdjk a Weboldalunk XHTML rszt s megadjuk a nvtr deklarcijt.
Fontos megjegyzs: A deklarcis rsz megadsa ktelez s nem hagyhat ki! A deklarcis rsz megadsa utn, kvetkezik az XHTML dokumentum fejlce s a trzse, amely
kz zrjuk a teljes dokumentumot. Az XHTML dokumentum a zr jellelemmel
fejezdik be.
b. A msodik rsz egy fejlc jellelem:
... amely olyan informcikat tartalmaz, amelyek az egsz dokumentumra vonatkoznak. A s
a fejlc jellelem kztt helyezzk el a dokumentumcmet a:
dokumentumcm jellelem segtsgvel, melynek szveges tartalma a bngsz cmsorban jelenik meg (nem a
Weblapon!). Plda:
My Life
2.2. kdrszlet Fejlc jellelem dokumentumcmmel
-
10
Fontos megjegyzs: Minden XHTML dokumentum tartalmaz jellelemet a
jellelembe begyazva.
c. A harmadik rsz a dokumentum trzse:
... ide kerl az a tartalom, amelyet meg szeretnnk jelenteni a bngszkben (szveg, kp,
hivatkozsok, listk stb.). A kvetkez egyszer pldadokumentum tartalmazza a deklarcis rszt, valamint a fejlc s trzs
jellelemet:
XHTML iskolaplda
Ez egy egyszer XHTML dokumentum.
2.3. kdrszlet Egy egyszer XHTML feladat kdrszlete A kdblokkunk forrsszvegt mentsk el a iskola-pelda.html nev llomnyba (a fjlnvvlaszts
tetszleges, a html kiterjeszts ktelez!). Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor a 2.1. brn lthat eredmnyt kapjuk.
2.1. bra A feladat kdrszlet eredmnye a bngszprogramban
-
11
3. XHTML nyelv attribtumai
A nyit jellelemek, a jellelem azonostn kvl, klnfle attribtum rtket is
tartalmazhatnak:
attribtum=rtk
alakban (a zr jellelemek nem tartalmazhatnak attribtumokat)! Az attribtumokkal tovbb
szablyozhatjuk a krlfogott szveg formzst. Az XHTML attribtumok listja:
accesskey class dir id lang style tabindex title
A tovbbiakban bemutatjuk az XHTML fontosabb attribtumait.
3.1 class attribtum
Az XHTML jellelemeknek olyan neveket adhatunk, amelyek bizonyos osztlyokhoz ktdnek,
gy mindezekre az jellelemekre rvidtett rsmddal stluslapokat alkalmazhatunk. A:
class=name attribtum alkalmazsa esetben a name azt az osztlynevet hatrozza meg, amelyikhez tartozik. 3.2 id attribtum
Az id=name
attribtum alkalmazsa estben a name egyedileg meghatrozza a jellelemet. Az XHTML
dokumentumban minden jellelem id attribtuma egyedi kell, hogy legyen! 3.3 title attribtum
A
title=string attribtum lehetv teszi, hogy a Weboldal rszeit megcmezzk. A string az a szveg, amely
megjelenik, ha a felhasznl az egrrel rmutat. 3.4 lang attribtum
Az
xml: lang=xx lang=xx attribtum, ahol az xx ktbets kd, meghatrozza a Weboldalnl hasznlt nyelvet (magyar: hu,
angol: en, el grg , fr francia stb.).
-
12
A kvetkez egyszer pldadokumentum a lang attribtum alkalmazst mutatja be:
XHTML lang attributum plda
The future is fuzzy
3.1. kdrszlet Az XHTML lang attribtum plda
A kdblokkunk forrsszvegt mentsk el a lang-pelda.html nev llomnyba. Tltsk be a
megszerkesztett XHTML fjlt a webbngszbe, ekkor a 3.1. brn lthat eredmnyt kapjuk.
3.1. bra A kdrszlet eredmnye a bngszprogramban
3.5 style attribtum
A
style=string attribtum helyi jelleg stilsmeghatrozst tesz lehetv. Az idzjelbe rjuk be a kvnt
stlusformt. Pldul:
style=color: red, border: solid A kvetkez egyszer pldadokumentum a style attribtum alkalmazst mutatja be:
-
13
XHTML style attribtum pelda
The future is fuzzy
3.2. kdrszlet A style attribtum alkalmazsa
A kdblokkunk forrsszvegt mentsk el a style-pelda.html nev llomnyba. Tltsk be a
megszerkesztett XHTML fjlt a webbngszbe, ekkor a 3.2. brn lthat eredmnyt kapjuk.
3.2. bra A kdrszlet eredmnye a bngszprogramban
4. Szvegblokk XHTML formzsa A tovbbiakban ttekintnk nhny szvegblokk formz XHTML jellelemet.
4.1 p s br jellelemek
Az XHTML nyelv a
szveg jellelemet hasznlja az j bekezds (paragrafus) ltrehozsra. Az j bekezds eltt res sort
hagy.
-
14
Ha egy bekezdsen bell j sort szeretnnk kezdeni, akkor a:
jellelemet hasznljuk soremelsre. Amikor a bngsz egy jellelemhez r, akkor az utna kvetkez szveget j sorban a bal margnl kezdi (4.1. bra). Megjegyzs: a br s a /
jelek kztti szkz hasznlata ktelez! Plda:
p s br jellelem plda
Minden XHTML dokumentum bekezdsekbl ll.
Ez egy j bekezds.
Itt pedig sortrs trtnikamelynek hatsra j sorban folytatdik a szveg.
4.1. kdrszlet A p s br jellelem plda A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor a 4.1. brn lthat eredmnyt kapjuk.
4.1. bra A kdrszlet eredmnye a bngszprogramban
-
15
4.2 hx jellelem Az XHTML nyelvben 6 cmsor-szint ltezik a cmek s alcmek jellsre:
cm ahol x egy szm 1 s 6 kztt, ami a cmszintet jelli. Az els (legfels) szint cm jelenik meg
legnagyobb, a hatodik szint cm pedig a legkisebb betmrettel. A cmek megjelentsekor nincs
megadva pontosan a bettpus s a fontmret, ezrt a klnbz bngszk msknt jelentik meg
azokat (4.2. bra). A jellelem alkalmazsa utn res sor kvetkezik. Plda:
hx jellelem plda
Fcmsor
Alcmsor
4.2. kdrszlet A hx jellelem plda
Tltsk be a megszerkesztett s elmentett XHTML fjlt a webbngszbe, ekkor a 4.2. brn
lthat eredmnyt kapjuk.
4.2. bra A kdrszlet eredmnye a bngszprogramban
-
16
4.3 hr jellelem Vzszintes vonalakat a:
jellelem segtsgvel tudunk ltrehozni. A jellelem egy vzszintes elvlaszt vonalat helyez el a Weboldalon, a rendelkezsre ll szlessgben.
Plda:
hr jellelem plda
XHTML
4.3. kdrszlet A hx jellelem plda A kdblokkunk forrsszvegt mentsk el. Tltsk be az XHTML fjlt a webbngszbe, ekkor a
4.3. brn lthat eredmnyt kapjuk.
4.3. bra A kdrszlet eredmnye a bngszprogramban
-
17
4.4 pre jellelem A
szveg jellelem segtsgvel elre formzott szveget tudunk ltrehozni. A szvegblokk ilyenkor
pontosan gy jelenik meg, ahogy azt begpeltk az XHTML dokumentumba (4.4. bra): Plda:
pre jellelem plda
$i= 2;
if ($i
-
18
4.4. bra A kdrszlet eredmnye a bngszprogramban
4.6 div jellelem A:
szveg jellelem segtsgvel a Weboldalt rszekre tudjuk osztani. Ez akkor clszer, amikor az
Weboldalrszekre nll stlust szeretnnk alkalmazni. A div jellelemmel a kvetkez
attribtumokat hasznlhatjuk:
Az id=name attribtum alkalmazsval a name egyedileg meghatrozza a jellelemet. A class=name attribtum alkalmazsval a name azt az osztlynevet hatrozza meg,
amelyikhez tartozik a jellelem.
4.7 address jellelem Az
szveg jellelem segtsgvel a Weboldal szerzjnek az email cmt adjuk meg. Az address jellelem
ltalban a Weboldal kezdetn vagy vgn tallhat.
Plda:
Webmester
4.5. kdrszlet Az address jellelem alkalmazsa
-
19
5. Szveges dokumentum XHTML sorformzsa A XHTML dokumentumokban az informci egyik f hordozja a szveg. Szveges
dokumentumok kezelsnl igen fontos feladat a szvegek formzsa. A szveg formzsra a CSS
stlustechnikt alkalmazzuk, a szveg alapformzsra viszont az XHTML nyelvben szmos
jellelem ltezik. A tovbbiakban ttekintnk nhny szvegkarakter-formz XHTML
jellelemet.
5.1 b, strong, em s i jellelemek Flkvr karaktereket a:
szveg ltalnosnl vastagabb (kiemelt) szveget:
szveg ltalnosnl jobban hangslyozott szveget:
szveg dlt karaktereket pedig az:
szveg jellelemek segtsgvel tudunk ltrehozni (5.1 bra).
Plda:
b, strong, em s i jellelem plda
Internet
HTTP
Web
HTML
5.1. kdrszlet A b, strong, em s i jellelem plda
-
20
A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor az 5.1. brn lthat eredmnyt kapjuk.
5.1. bra A kdrszlet eredmnye a bngszprogramban
5.2 big s small jellelemek A krnyez szveghez viszonytva nagyobb betformtumot a:
szveg kisebb betformtumot pedig a:
szveg jellelem alkalmazsval hozhatunk ltre (5.2. bra):
Plda:
big s small jellelem plda
Az XHTML az Internet publikls s alkalmazsfejleszts
nyelve.
A HTML (Hypertext Markup Language) nyelvet eredetileg
szvegalap dokumentumok kezelsre fejlesztettk ki.
5.2. kdrszlet A big s small jellelem plda
-
21
A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor az 5.2. brn lthat eredmnyt kapjuk.
5.2. bra A kdrszlet eredmnye a bngszprogramban
5.3 sub s sup jellelemek
Alsindexet a: als index felsindexet pedig a: fels index jellelemek segtsgvel tudunk ltrehozni. Plda (5.3. bra):
sub s sup jellelem plda
H2O
x3
5.3. kdrszlet A sub s sup jellelem plda
A kdblokkunk forrsszvegt mentsk el. Tltsk be az XHTML fjlt a webbngszbe, ekkor az
5.3. brn lthat eredmnyt kapjuk.
-
22
5.3. bra Az kdrszlet eredmnye a
bngszprogramban
5.4 cite, dfn s var jellelemek
Idzeteket a: idzet
jellelem hasznlatval, defincikat:
definci jellelemek alkalmazsval hozhatunk ltre. Plda:
dfn plda
Az XHTML (Extensible HyperText Markup Language) egy struktrban
gazdag jellnyelv, amely a megjelentst a stluslapokra bzza, modulris
alapokra pl s egyttmkdik az XML (Extensible Markup Language) alap
felhasznli alkalmazsokkal.
5.4. kdrszlet A dfn jellelem plda
-
23
A kdblokkunk forrsszvegt mentsk el. Tltsk be az XHTML fjlt a webbngszbe, ekkor a
5.4. brn lthat eredmnyt kapjuk.
5.4. bra Az kdrszlet eredmnye a bngszprogramban
Vltoznevet pedig a:
vltoznv jellelemek alkalmazsval hozhatunk ltre.
Plda:
var jellelem plda
$x=2
5.5. kdrszlet Az var jellelem plda
-
24
A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor az 5.5. brn lthat eredmnyt kapjuk.
5.5. bra A kdrszlet eredmnye a bngszprogramban
5.5 tt, code, kbd, samp jellelemek Fixpontos betket eredmnyez a:
szveg jellelem hasznlata, ekkor a szveg azonos trfoglals, az rgp kimenethez hasonl
karakterekkel jelenik meg. Plda:
tt plda
print ("Hello from xHTML");
5.6. kdrszlet A tt jellelem plda
-
25
A kdblokkunk forrsszvegt mentsk el. Tltsk be az XHTML fjlt a webbngszbe, ekkor a
5.6. brn lthat eredmnyt kapjuk.
5.6. bra Az kdrszlet eredmnye a bngszprogramban
Kdrszleteket:
kdrszlet jellelemek segtsgvel tudunk ltrehozni. Plda:
code plda
$autok []= "Audi";
$autok []= "BMW";
$autok []= "Fiat";
$autok []= "Ford";
$autok []= "Honda";
$autok []= "Toyota";
print $autok[5];
5.7. kdrszlet A code jellelem plda
-
26
A kdblokkunk forrsszvegt mentsk el. Tltsk be az XHTML fjlt a webbngszbe, ekkor a
5.7. brn lthat eredmnyt kapjuk.
5.7. bra Az kdrszlet eredmnye a bngszprogramban Billentyfelirat jelzst:
szveg mintk bemutatst pedig:
plda jellelemek segtsgvel tudunk ltrehozni.
5.6 acronym jellelem Az:
rvidts jellelem egy szbl ll rvidtett fogalmak magyarzatra szolgl (5.8. bra). Plda:
acronym jellelem plda
USA
5.8. kdrszlet Az acronym jellelem plda
-
27
A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor az 5.8. brn lthat eredmnyt kapjuk.
5.8. bra A kdrszlet eredmnye a bngszprogramban
5.7 ins, del jellelemek Az
begyazott szveg jellelem begyazott szveg bemutatsra szolgl (a begyazott szveg alhzott).
Plda:
ins jellelem plda
Az XHTML kdrszlet ellenrzse igen fontos feladat. Az ellenrzssel
mdunkban van betartani a W3C ajnlsait s kikszblni a hibkat az XHTML
kdrszletekben.
5.9. kdrszlet Az ins jellelem plda
A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor az 5.9. brn lthat eredmnyt kapjuk.
-
28
5.9. bra A kdrszlet eredmnye a bngszprogramban Szvegtrlst a:
kitrlt szveg jellelem segtsgvel valstjuk meg. A kitrlt szveg thzott. Plda:
del jellelem plda
Jelenleg az xHTML 1.0 verzi fejlesztsnl tartunk.
5.10. kdrszlet Az del jellelem plda
A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor az 5.10. brn lthat eredmnyt kapjuk.
5.8 span jellelemek A
szveg in-line jellelem szerepe az, hogy komplett szvegblokkot magba zrva, a tbbi szvegtl
elklntett, nll stlust rendelhessnk hozz. Attribtumai: style=string, class =name vagy
id=name.
-
29
5.10. bra A kdrszlet eredmnye a bngszprogramban 6. Hiperhivatkozsok Az XHTML dokumentumok egymshoz csatolsbl addik az XHTML jellnyelv hatkonysga.
Az XHTML dokumentum rszeihez hivatkozsokat (linkeket) helyezhetnk el, amelyeket
aktivizlva, a hivatkozottal sszefggsben lv szveghez juthatunk el. A hiperhivatkozsok
ltrehozsra az:
jellelemet hasznljuk. A page.html a hivatkozott Weboldal URL cme. A nyit jellelem legfontosabb attribtuma a href (hypertext reference), ami azt a Webcmet
azonostja, ahov a hiperhivatkozs aktivizlsa esetben kell elugrania a bngsznek. Teht az
jellelembe rt szvegmezre rkattintva a href-ben megadott Webcmre kerlnk. A sajt
Weboldalaink esetben relatv, idegen Weboldalak esetben pedig abszolt URL cmeket
hasznlunk. Amikor a felhasznl az egrrel rmutat a hivatkozsra a megfelel URL cm
megjelenik, ha pedig rkattint megjelenik a krt Weboldal.
Plda hiperhivatkozs Weboldalra:
Hiperhivatkozs Weboldalra
Hiperhivatkozs Weboldalra
-
30
Volleyball
6.1. kdrszlet Hiperhivatkozs Weboldalra
Plda hiperhivatkozs Webcmre:
Hiperhivatkozs Webcmre
Hiperhivatkozs a W3C Web cmre
W3C Web site
6.3. kdrszlet Hiperhivatkozs Webcmre A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
bngszbe s a 6.1. brn lthat eredmnyt kapjuk.
6.1. bra A kdrszlet eredmnye a bngszprogramban
-
31
Ha a felhasznl az egrrel rkattint a hivatkozsra, akkor megjelenik a krt Weboldal:
6.2. bra Az egrkattints eredmnye a bngszprogramban. A fent bemutatott eljrsok a kezd Weboldalra vezetnek bennnket ( az index.html vagy
default.html fjlokra), ha viszont a hivatkozsnak egy msik fjl valamely pontosan meghatrozott
rszre kell mutatnia, akkor hivatkozott Weboldalon n. horgonyt kell elkszteni ahov a
hivatkozs mutat:
ahol a jelz szveg, amely meghatrozza a hivatkozott Weboldalt. Az gy elksztett horgonyra val
hivatkozs felrhat kvetkezkppen:
ha a horgony ugyanabban a dokumentumban tallhat:
ha a horgony az XHTML dokumentummal megegyez knyvtrban tallhat:
ha a horgony egy msik Webcmen tallhat , akkor a teljes URL cmet kell felrnunk:
7. Kpek begyazsa A kpek begyazsra az:
jellelem szolgl. Tbb attribtuma is van teht, pldul:
src=image.url A kpfjl helyt (URL-jt) tartalmazza.
height - Megadja a kp magassgt kppontokban.
width - A kp szlessgt adja meg kppontokban.
border - kpkeret vastagsgt hatrozza meg kppontokban.
id=kpazonost
-
32
Ha a kpfjl a XHTML dokumentummal megegyez knyvtrban tallhat, akkor csak a fjlnevet
kell megadnunk.
Plda: guru.gif
Ha a kpfjl a XHTML dokumentumhoz kpest egy msik knyvtrban tallhat, akkor a fjlnevet
egy tvonallal kell kiegszteni.
Plda: images/guru.gif
Ha a kpfjl egy msik Web cmen tallhat, akkor megadjuk a teljes http cmet. Plda:
Kepek beagyazasa
7.1. kdrszlet Kpbegyazsi plda
A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor az 7.1. brn lthat eredmnyt kapjuk.
7.1. bra A kdrszlet eredmnye a bngszprogramban
-
33
8. Listk ltrehozsa Az XHTML nyelvben:
sorszm nlkli, sorszmozott s ler
listt hasznlunk, melyek egymsba gyazhatk, gy komplex listk hozhatk ltre. A Weboldal
tartalma leghatkonyabban listk alkalmazsval valsthat meg.
8.1 Sorszm nlkli listk Akkor hasznljuk, ha nincs szksg a listasorok szmozsra. A sorszm nlkli listt (unordered
list):
jellelem segtsgvel tudjuk megnyitni. A listaelemet (list item):
jellelem alkalmazsval tudjuk elhelyezni a listban bajusz mgtt. Ahny listaelemnk van,
annyi jellelemsort runk fel. A sorszm nlkli listk alaprtelmezett bajuszos
bekezdsjele: (disc). Sorszm nlkli listaplda kdrszlete (8.1. bra):
Sorszmozatlan lista
Sorszmozatlan lista
Els listasor
Msodik listasor
Harmadik listasor
8.1. kdrszlet Sorszmozatlan lista feladat
-
34
A kdblokkunk forrsszvegt mentsk el. Tltsk be az XHTML fjlt a webbngszbe, ekkor az
8.1. brn lthat eredmnyt kapjuk.
8.1. bra A kdrszlet eredmnye a bngszprogramban
8.2. Sorszmozott listk Sorszmozott listt akkor hasznlunk ha szksges a listaelemek szmozsa. A sorszmozott listt
(ordered list):
jellelem hasznlatval valsthatjuk meg.
A listaelemeket jellelemsorokkal tudjuk elhelyezni a listban sorszm mgtt. Ebben
az esetben is ahny listasorunk van, annyi jellelemet runk fel. A sorszmozott listk
alaprtelmezett bekezdsjele: 1,2,3,.... Sorszmozott listaplda kdrszlete:
Sorszmozott lista
Sorszmozott lista
Els listasor
-
35
Msodik listasor
Harmadik listasor
8.2. kdrszlet Sorszmozott lista A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor az 8.2. brn lthat eredmnyt kapjuk.
8.2. bra A kdrszlet eredmnye a bngszprogramban Az utasts 1-tl kezdi a listasorok szmozst. A sorszmozott lista esetben a kezd sorszm
kzvetlenl megadhat a:
formj nyit jellelemmel, ahol az n a kezd sorszm. A stluslapokban a:
list-style-type: marker stlusjellelem bevitelvel a kvetkez formj bajusz vagy sorszmjellst kapjuk meg:
MARKER RTK: BAJUSZ/SORSZMJELLS marker ="disc" marker =" circle " marker =" square " marker ="decimal" 1, 2, 3, ... marker ="upper-alpha" A, B, C, ... marker ="lower-alpha" a, b, c, ... marker ="upper-roman" I, II, III, ... marker ="lower-roman" i, ii, iii, ...
8.1. tblzat
-
36
A stluslapokban a:
list-style-image: url(image.gif) stlusjellelem bevitelvel kp formj bajusz vagy sorszmjellst kapunk (az image.gif kpfjlt
hasznlja).
8.3. Ler listk Ler listt (definition list) akkor hasznlunk ha az egyes lista jellelemekhez tartozhat egy
hosszabb lers is. A ler listt a:
nyit-s zr jellelemek kz kell zrni. A listk egyes kifejezseit a:
(terms) jellelemekben, a kifejezsekhez tartoz lersokat pedig a:
jellelemekben tudjuk elhelyezni. Ler listaplda kdrszlete (8.3. bra):
Ler lista
Leir lista
Els kifejezs
Az els kifejezs hosszabb lersa
Msodik kifejezs
A msodik kifejezs hosszabb lersa
Harmadik kifejezs
A harmadik kifejezs hosszabb lersa
8.3. kdrszlet Ler lista feladat
-
37
A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor az 8.3. brn lthat eredmnyt kapjuk.
8.3. bra A kdrszlet eredmnye a bngszprogramban
9. XHTML tblzatok Egy XHTML tblzatot a:
jellelemmel hozunk ltre. A tblzat egszre rvnyes egyes attribtumokat a nyit jellelemben adjuk meg a
kvetkezkppen:
border=szm keretmret,
cellpadding=szm meghatrozza az res hely nagysgt a cellkon bell az adatok krl,
cellspacing=szm meghatrozza az res hely nagysgt a cellk kztt,
width=szm tblzatmret,
bgcolor=sznkd httrszn. Egy XHTML tblzat tblzatsorokbl s cellkbl ll. A tblzatsorokat a:
jellelemmel hozunk ltre s ezek kztt kell az adott tblzatsor egyes cellit meghatrozni.
-
38
A tblzatcellkat a:
jellelem segtsgvel hozunk ltre.
XHTML tblzatok programtrzse:
1 sor s 2 cella:
9.1. kdrszlet Az egysoros ktoszlopos
tblzat kdrszlete
2 sor s 2 cella:
9.2. kdrszlet A ktsoros ktoszlopos
tblzat kdrszlete
Plda: egysoros ktoszlopos tblzat
Egyszer tblzat
Cella 11
Cella 12
-
39
9.3. kdrszlet Az egysoros ktoszlopos tblzat kdrszlete A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor az 9.1. brn lthat eredmnyt kapjuk.
9.1. bra A kdrszlet eredmnye a bngszprogramban Plda: ktsoros hromoszlopos tblzat
Ktsoros s hrom oszlopos tblzat
Cella 11
Cella 12
Cella 13
Cella 21
-
40
Cella 22
Cella 23
9.4. kdrszlet A ktsoros hrom oszlopos tblzat A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor az 9.2. brn lthat eredmnyt kapjuk.
9.2. bra A kdrszlet eredmnye a bngszprogramban
A tblzatnak a:
jellelemmel cmet adhatunk amely a tblzat felett jelenik meg.
Plda:
Egyszeru tablazat
-
41
XHTML tblzat
Cella 11
Cella 12
Cella 13
Cella 21
Cella 22
Cella 23
9.5. kdrszlet A ktsoros hromoszlopos tblzat cm s cella elrendezssel A kdblokkunk forrsszvegt mentsk el. Tltsk be az XHTML fjlt a webbngszbe, ekkor az
9.3. brn lthat eredmnyt kapjuk.
9.3. bra A kdrszlet eredmnye a bngszprogramban
-
42
A rowspan s a colspan attribtumok segtsgvel sorokat s oszlopokat lehet sszevonni egy
tblzatban:
rowspan =szm az sszevont sorok szma colspan =szm az sszevont oszlopok szma
Plda:
sszevont oszlopos tblzat
XHTML tblzat
Cella 11+12
Cella 13
Cella 21
Cella 22
Cella 23
9.6. kdrszlet A ktsoros hromoszlopos tblzat, cm s cella elrendezssel valamint kt sszevont oszloppal
A kdblokkunk forrsszvegt mentsk el. Tltsk be az XHTML fjlt a webbngszbe, ekkor az
9.4. brn lthat eredmnyt kapjuk. A tblzat fejlcnek ltrehozsra a:
jellelem szolgl. A fejlcben lv adatok flkvr karakterekkel rdnak ki.
-
43
A tblzat lblcnek ltrehozsra a:
jellelem szolgl. A lblcben lv adatok is flkvr karakterekkel rdnak ki. A tblzat trzst:
jellelemmel hozhatjuk ltre (a lblc utn kell megadni).
A
jellelem segtsgvel a tblzat tbb oszlopt tudjuk egyszerre ltrehozni. Az itt megadott
attribtumok az sszes ltrehozott oszlopra rvnyesek! A
jellelem segtsgvel megadhatjuk a tblzat egy oszlopt a jellelemen bell.
9.4. bra A kdrszlet eredmnye a bngszprogramban Plda:
-
44
sszevont soros tblzat
XHTML tblzat
Cella 11+21 Cella 12 Cella 13 Cella 22 Cella 23
9.7. kdrszlet A ktsoros hromoszlopos tblzat, cm s cella elrendezssel valamint kt sszevont sorral A kdblokkunk forrsszvegt mentsk el. Tltsk be az XHTML fjlt a webbngszbe, ekkor az
9.5. brn lthat eredmnyt kapjuk.
9.5. bra A kdrszlet eredmnye a bngszprogramban
-
45
A
jellelemet hasznljuk a cella megadsra ha azt akarjuk, hogy a cella gy viselkedjen mintha
fejlc lenne. A cella szvege flkvr lesz. Plda:
Fejlc 9.8. kdrszlet A fejlc kdrszlete
Az XHTML tblzatok egymsba gyazhatk, A cellk tartalmazhatnak szveget, kpet, de akr
egy j tblzatot is! sszetett Weblapot megjelenthetnk tblzatknt is.
10. XHTML keretek
Az XHTML keretek alkalmazsval a Weblapot rszekre (rgikra) oszthatjuk. A rgikban az
egy-egy nll XHTML dokumentum tartalmt jelenthetjk meg. A keretek alkalmazsa akkor
clszer, ha a Weboldal egyes rszeinek a tartalma nem vltozik (gy akkor nem kell mindig jra
tlteni).
A XHTML kereteket az n. frameset dokumentumban a:
jellelem segtsgvel adjuk meg. Meghatrozza a keretek szmt s mrett. A jellelem hasznlata esetben nem hasznlhatunk jellelemet!
A nyit jellelem cols s rows attribtumban az egyes keretek mrete fggleges vagy vzszintes irnyban, % -ban vagy pixelben adhat meg. A maradk kpernyterletre *
karakter hasznlatval lehet hivatkozni.
A:
jellelem szolgl a tnyleges kerettartalmak megadsra. Egy jellelem annyi jellelemet tartalmaz, ahny rszre osztottuk a Weboldalt. A kerethatrol vonalak egr segtsgvel elmozdthatk a bngszben.
Az
jellelem Weboldalon belli keret ltrehozst teszi lehetv. Felhasznlhat egy XHTML oldal
begyazsra egy msik XHTML oldalba.
-
46
A kvetkez feladat kt vzszintes keretet mutat be.
Vzszintes keretek
10.1. kdrszlet Vzszintes keretfeladat
A kdblokkunk forrsszvegt mentsk el. Tltsk be az XHTML fjlt a webbngszbe, ekkor az
10.1. brn lthat eredmnyt kapjuk.
10.1. bra A kdrszlet eredmnye a bngszprogramban
A kvetkez feladat hrom fggleges keretet mutat be.
-
47
Fggleges keretek
10.2. kdrszlet Fggleges keretfeladat
A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor az 10.2. brn lthat eredmnyt kapjuk.
10.2. bra A kdrszlet eredmnye a bngszprogramban
A kvetkez plda esetben vegyes keretmegoldst mutatunk be:
-
48
Vegyes keret plda
10.3. kdrszlet Vegyes keretfeladat
A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor az 10.3. brn lthat eredmnyt kapjuk.
10.3. bra A kdrszlet eredmnye a bngszprogramban 11. Java-appletek beillesztse az XHTML dokumentumba A Java magasszint, objektum-orientlt, internet-programozsi nyelv. A Javban ihatk Java-
appletek, amelyek nem nll Java-programok, mivel az Applet megjelentshez Java-kompatibilis
webbngszt ignyelnek. A Java-applet beillesztsre az XHTML dokumentumba a:
jelljellelemet hasznljuk.
-
49
A classid=java:file.class
attribtummal a lefordtott .class kiterjeszts Java-applet nevt adjuk meg.
A width=szlessg
attribtummal a kpernyn megjelen Applet szlessgt adjuk meg kppontokban (pixel). A
height=magassg attribtummal a kpernyn megjelen Applet magassgt adjuk meg kppontokban (pixel). A nyit s zr object jellelem kz a:
jellelem segtsgvel megfelel szm paramtert helyezhetnk el. A Java-applet futtatshoz, az Applet meghvsra a szvegszerkesztvel szerkesztennk kell teht
egy megfelel XHTML-dokumentumot (11.1. bra).
Udvozlet2
11.1. kdrszlet Java-applet XHTML dokumentum Mentsk el a megszerkesztett XHTML-dokumentumot tetszleges nven .html kiterjesztssel
ugyanabba a knyvtrba ahol a Java-applet is tallhat. Tltsk be a megszerkesztett XHTML fjlt
a Java-kompatibilis webbngszbe (vagy a Java Applet Viewer-be), ekkor az Applet vgrehajtdik
(11.1. bra). Amikor a webdokumentum szolgltatja megrja a Java-appletet, a megfelel XHTML
dokumentumba hivatkozst helyez el az Appletre, majd a Java-appletet s a XHTML
dokumentumot a szerveren helyezi el. Ha egy internetfelhasznl webbngszje segtsgvel
letlti az XHTML dokumentumot, akkor az Applet vgrehajtdik.
Fontos megjegyzs: Egy Java-applet csak a webbngszvel egyttmkdve tud lefutni!
-
50
11.1. bra Az Applet megjelense a bngszprogramban
12. XHTML rlapok Az rlapok (szvegablakok, adat- s jelszbeviteli mezk, gombok, vlasztgomb csoportok) az
XHTML dokumentumban a prbeszdet teszik lehetv. Feldolgozsukhoz kln programot kell
hasznlni (pldul PHP programokat).
12.1. rlapkszts Minden rlap jellelem a:
rlaptartalom jellelem kztt kell, hogy elhelyezkedjen amely a kitltend rlap tartalmt jelli ki. A tartalmat az action attribtumban megadott szkript program dolgozza fel:
action=script.url ahol a script.url a PHP szkript elrsi tvonala. A form jellelem action paramtere arra a PHP
fjlra mutat, amely feldolgozza az rlapon megadott adatokat. Ha az action attribtum csak a
fjlnak a nevt adja meg, akkor az XHTML s a PHP programot tartalmaz fjloknak egy
knyvtrban kell lennik. A:
method=POST attribtum meghatrozza a kitlttt rlap tovbbtsi mdjt a feldolgoz szkript program fel.
Lehetsges rtkei:
-
51
GET az URL-ben, POST adatcsomagban (biztonsgosabb md) tovbbtja az adatokat.
Ha nem tartjuk clszernek, hogy az rlap adatait egy szkript program dolgozza fel, akkor
vlaszthatjuk azt a megoldst, hogy a felhasznl ltal kitlttt adatokat elektronikus postval
tovbbtjuk. Ekkor a kldend szveg formattlsra felhasznljuk a kvetkez attribtumot:
enctype=text/plain Az action attribtumban pedig megadjuk az e-mail cmet ahov az adatokat tovbbtjuk:
action=mailto:e-mail cm
12.2. Adatbeviteli mezk Az adatbeviteli mezket az:
jellelemmel hozhatjuk ltre.
A name attribtum rtke a meznv, amely alapjn a feldolgoz szkript program azonostja a
bevitt adatot.
A type attribtum hatrozza meg a beviteli mez adattpust. Lehetsges adattpusok:
1. Nyomgomb: type=button
2. Kapcsol (tbb is kivlaszthat egyszerre): type=checkbox
A checkbox tpus mez esetben a:
checked=checked attribtum alkalmazsval alaprtelmezsknt bekapcsoljuk a kapcsolt.
3. Csatoland fjl: type=file
4. Rejtett adattpus (bevitelkor nem jelenik meg): type=hidden
5. Kp: type=image
6. Jelsz (bevitelkor nem jelenik meg): type=password
7. Rdikapcsol (egyszer csak egyet lehet kivlasztani): type=radio
-
52
A radio tpus mez esetben a:
checked=checked attribtum alkalmazsval alaprtelmezsknt bekapcsoljuk a rdikapcsolt.
8. Inicializl gomb: type=reset
A reset gomb lenyomsa alaprtkkel tlti fel az adatbeviteli mezket.
9. Adattovbbt gomb: type=submit
A submit gomb lenyomsnak hatsra kldjk el az rlapok adatait a feldolgoz szkript (PHP)
programnak. A submit s a reset gombokhoz tartoz:
value=felirat attribtum alkalmazsval a gombok feliratt hatrozzuk meg .
10. Szveg: type=text
A text s password adattpus beviteli mez esetn a beviteli ablak szlessgt a:
size=mret az ablakba bevihet maximlis szveghossz pedig a:
maxlenght=rtk attribtumokkal hatrozzuk meg. Plda:
Jelsz megads
Jelsz megads:
12.1. kdrszlet A jelsz megadsa
-
53
A kdblokkunk forrsszvegt mentsk el. Tltsk be az XHTML fjlt a webbngszbe, ekkor az
12.1. brn lthat eredmnyt kapjuk.
12.1. bra A kdrszlet eredmnye a bngszprogramban
A: value=szveg
attribtum alkalmazsval a szveg adatot veszi fel alaprtelmezs-knt a szveges beviteli mez. A:
szveg jellelemmel hozhatjuk ltre a tbbsoros szvegbeviteli mezt. A name attribtum rtke a
meznv. A:
rows=rtk s
cols=rtk attribtumok a megnyl beviteli ablak sorainak szmt s szlessgt adjk meg. A:
value=szveg
attribtum alkalmazsval az alaprtelmezsknt megjelentend szveg adhat. Ha a felhasznlnak egy lista kszletbl szeretnnk vlasztsi lehetsget adni akkor ezt a:
szveg jellelem alkalmazsval tudjuk megtenni. A nyit jellelem jelzi a lista kezdett, alapbelltsban egy legrdl ment eredmnyez. A:
name=nv attribtum rtke a meznv, amely alapjn a feldolgoz szkript program azonostja a bevitt
listakszlet nevt.
-
54
A: size=sorok
attribtum meghatrozza, hogy hny sorban jelenjenek meg a vlaszthat listajellelemek.
Megadsval szkrollozhat ment kapunk (alaprtelmezs szerint legrdlt).
A listba az szveg
jellelem segtsgvel tudunk listajellelemeket elhelyezni. Egyszerre tbb listajellelem kijellsre a:
multiple=multiple attribtumot hasznljuk. Plda:
Legrdl men
Halasbolt:
csuka
harcsa
ponty
keszeg
12.2. kdrszlet A legrdl men kdrszlete
-
55
A kdblokkunk forrsszvegt mentsk el. Tltsk be a megszerkesztett XHTML fjlt a
webbngszbe, ekkor az 12.2. brn lthat eredmnyt kapjuk.
12.2. bra A kdrszlet eredmnye a bngszprogramban
Egyszer gombot a:
... jellelem segtsgvel tudunk ltrehozni. A gombhoz szkripteket rendelhetnk, melyek
gombnyomssal aktivldnak. Az informcik csoportostsra a:
szvegblokk jellelemet hasznljuk, mely jellelem kztti szvegblokkot a bngsz (a tbbi szvegtl
elklntve) bekeretezve jelenti meg.
A:
cmkeszveg jellelem alkalmazsval a keret bal fels szln cmkeszveget is rhatunk. A mezk a:
felirat jellelemmel feliratozhatk. Plda:
-
56
rlap kitlts
Szemlyi adatok
Vezetknv Keresztnev Szletsi dtum
12.3. kdrszlet rlapkitlts
12.3. bra A kdrszlet eredmnye a bngszprogramban
-
57
13. XHTML szkriptek
13.1 Alapfogalmak, begyazott s kls szkriptek Szkripteknek azokat a kis programokat nevezzk, amelyek a XHTML oldalakkal egytt, vagy
azokba gyazva tltdnek le a kliens szmtgpre. Teht a szkriptek lehetnek:
begyazottak az XHTML programba, vagy kls szkriptek.
A szkripteket a bngszprogramok futtatjk.
Az XHTML dokumentum fejlcben a:
Script-tartalom elemet hasznljuk a begyazott szkript kd elhelyezsre. A script elem segtsgvel futatni tudjuk
a JavaScript, JScript s VBScript programokat. A language-name meghatrozza a szkript nyelvet,
amelyet alkalmazunk.
Kls szkriptek hasznlata esetben:
Szkript-tartalom
a szkript meghvsra a kvetkez attribtumot hasznljuk:
src=script.url ahol a script.url a kls szkript elrsi tvonalt hatrozza meg.
A charset=code attribtum segtsgvel a kls szkript jellkszlett hatrozhatjuk meg ha a
code helybe a kls szkript jellkszletnek a nevt rjuk be.
Plda:
JavaScript-tartalom A fenti plda esetben JavaScript-tet hasznlunk, amelynek az elrsi tvonala:
http://subotica.net/prog Nem minden bngsz tmogatja a szkriptek hasznlatt. Azok szmra, akik ilyen bngszt
hasznlnak, alternatv megoldst nyjt a
Szveges megjegyzs elem. A nonscript elem nyit- s zr jelleleme kz teht szveges megjegyzst tehetnk. Ez a
szveg akkor jelenik meg, ha a bngsz nem tudja futtatni a szkriptet. Futtatsuk szempontjbl a szkripteket feloszthatjuk:
-
58
a. Automatikusan futtat szkriptek ezek akkor aktivldnak, ha a bngsz beolvassa ket.
A felhasznl ezekre a szkriptekre nem tud kihatni.
b. Esemnyszkriptek akkor aktivldnak, ha a felhasznl aktivlja ket.
13.2 Esemnyszkriptek Az XHTML dokumentumokban a kvetkez esemnyeket (events) hasznlhatjuk:
onload - aktivldik, ha a bngsz beolvassa a Web oldalt, a body elemmel hasznlhat.
onunload - aktivldik, ha a bngsz kitrli a Web oldalt, a body elemmel hasznlhat.
onclick - aktivldik, ha a felhasznl rkattint a Web oldal elemre.
ondblclick - aktivldik, ha a felhasznl ktszer rkattint a Web oldal elemre.
onmousedown - aktivldik, ha a felhasznl rmutat az XHTML elemre.
onmouseup - aktivldik, ha a felhasznl rmutatva az XHTML elemre, elengedi az egr
gombjt.
onmouseover - aktivldik, ha a felhasznl rmutat a Web oldal elemre.
onmouseout - aktivldik, ha a felhasznl az egrkurzorral elhagyja a Web oldal elemt.
onmousemove - aktivldik, ha a felhasznl az egrkurzorral elmozdul a Web oldal elemn.
onselect - aktivldik, ha a felhasznl kivlaszt valamilyen szveget a Web oldalon.
onfocus - aktivldik, ha a felhasznl kivlaszt valamilyen elemet a Web oldalon.
onblur aktivldik, ha a felhasznl elhagyja az elzleg fkuszlt elemet.
onkeypress - aktivldik, ha a felhasznl ber valamilyen jelet a Web oldal rlapjra.
onkeydown - aktivldik, mieltt a felhasznl felengedi a gombot.
onkeyup - aktivldik, amikor a felhasznl a bers utn felengedi a gombot.
onsubmit - aktivldik, ha a felhasznl megnyomja az rlap gombjt.
onreset - aktivldik, ha a felhasznl megsemmisti az rlapot.
onchange - aktivldik, ha a felhasznl megvltoztatja az rlapon az rtket.
14. XHTML kdrszletek ellenrzse Az XHTML kdrszlet ellenrzse igen fontos feladat. Az ellenrzssel mdunkban van betartani a
W3C ajnlsait s kikszblni a hibkat az XHTML kdrszletekben.
-
59
Az ellenrzshez a W3C Weboldaln tallhat oldalakat hasznlhatjuk, webcme:
http://validator.w3.org vagy valamilyen ellenrzsi programot, mint pl. a:
CSE HTML Validator Lite v 3.50 amelynek webcme:
http://www.htmlvalidator.com
A W3C ellenrzsi oldala olyan formot tartalmaz, ahov berhatjuk az oldalunk URL-jt. Az
ellenrz program az llomnyunkban megadott DTD-t fogja hasznlni. Ha kitltttk a formot a
weboldalunk ellenrzse megtrtnik. Az ellenrzs eredmnye lehet:
hibkat tartalmaz, vagy rvnyes, a W3C ajnlsainak megfelel oldal.
A kvetkez ellenrzsi pldnl bemutatjuk a CSE HTML Validator Lite v 3.50 ellenrz program
hasznlatt. A kitztt cl egy XHTML tblzat kdrszletnek az ellenrzse. A 14.1-es kdrszlet
bemutatja az ellenrztt XHTML dokumentumot (az ellenrzst a F6-os gombbal indtottuk el).
14.1. kdrszlet Ellenrztt hibs XHTML dokumentum
Az elvgzett ellenrzs utn vilgosan leolvashatk a hibajelzsek! A hibk kijavtsa s az jabb
ellenrzs utn mr lthat, hogy az XHTML dokumentumunk megfelel a W3C ajnlsainak (14.2-
es kdrszlet)!
-
60
14.2. kdrszlet Ellenrztt, a W3C ajnlsainak megfelel XHTML dokumentum
14.3. bra Az ellenrztt s kijavtott kdrszlet eredmnye a bngszprogramban
-
61
CSS technolgia
1. Bevezets
A W3C (World Wide Web Consortium) hozta ltre a CSS (Cascading Style Sheet- lpcszetes
stluslapok) specifikcit. A CSS technolgia alkalmazsnak alapvet clja:
bevezetni a stluslapok (Style Sheet) alkalmazst az XHTML dokumentum formzsi utastsai helyet,
sztvlasztani az XHTML dokumentum tartalmi rszt a megjelentsi stlusjellelemektl.
Az XHTML teht a dokumentum megjelentst a stluslapokra bzza. A stluslapok segtsgvel az
XHTML dokumentum szerzje a Web oldal minden megjelensbeli jellemzjt bellthatja az
ignyeknek megfelelen. A kaszkd (Cascading) elnevezs arra utal, hogy egy Web dokumentum
megjelentse tbb stluslap egyttes hatsnak eredmnye. A CSS specifikcinak tbb verzija ltezik. A mai bngszk kezelni tudjk az els kt verzit
(CSS1 s CSS2). A W3C jelenleg a harmadik verzi fejlesztsn dolgozik (CSS3).
2. Stluslapok felptse
2.1 Alapfogalmak
A stluslap a stlusinformcit nll stlusdefincik sorozataknt adja meg. A stlusdefinci
struktrja kt rszbl ll:
1. Ttelnv, amely meghatrozza, hogy a stlusinformci melyik jellelemekre vonatkozik. A
ttelnv lehet egy XHTML jellelem neve (ez esetben az jellelem nevt nem tesszk kisebb-
nagyobb jelek kz!), vagy egy globlis osztlynv.
2. Deklarcis blokk, amelyben pontosvesszkkel elvlasztva stlusdeklarcik szerepelnek. A
deklarcis blokkot kapcsos nyit- s csuk zrjelek kz zrjuk.
-
62
Minden stlusdeklarci szintaktikailag ngy rszbl ll (2.1 bra):
az attribtum nevbl, kettspontbl, az attribtum adott rtkbl s pontosvesszbl:
2.1. bra A stlusdefinci struktrja Egy egyszer stluslapstruktra pldt az 2.1. kdrszlet mutat be:
h1 {
color: red;
}
2.1. kdrszlet Egyszer stluslapstruktra plda
A 2.1. kdrszletben bemutatott stluslap egy stlusdeklarct tartalmaz, amely a h1 jellelemre
vonatkozik s azt rja el, hogy a hatkrbe tallhat sszes h1 jellelem szvegblokkja piros
sznnel jelenjen meg. A fenti plda esetben:
h1 a ttelnv, { color: red; } - a deklarcis blokk, color: - az attribtum neve kettsponttal, red; - az attribtum rtke pontosvesszvel.
A 2.2. kdrszletben bemutatott stluslap kt stlusdeklarct tartalmaz, amely a h1 jellelemre
vonatkozik s azt rja el, hogy a hatkrbe tallhat sszes h1 jellelem szvegblokkja 12
pontos betvel s piros sznnel jelenjen meg. Ez esetben az attribtumok nevt s rtkeit felsorols
kzben pontosvesszvel vlasztjuk el egymstl:
h1 {
font-size: 12px;
color: red;
}
2.2. kdrszlet Kt stlusdeklarcit tartalmaz plda
ttelnv{
attribtum: rtk;
}
-
63
Megjegyzs: Az utols attribtum rtk utn nem ktelez kirni a pontosvesszt. Ha szksges tbb jellelemre ugyanazt a deklarcis blokkot alkalmazni, akkor a ttelnv helyn
tbb jellelem nevt (csoportmegads) is megadhatjuk (2.3 kdrszlet). Ez esetben a ttelneveket
felsorols kzben vesszvel vlasztjuk el egymstl:
h1, h2, h3 {
font-size: 12px;
color:red;
}
2.3. kdrszlet Hrom jellelemre vonatkoz stlusdeklarci A 2.3 kdrszlet annyiban klnbzik az 2.2 kdrszlettl, hogy a deklarcis blokk a h1
jellelem mellett mg a h2 s h3 jellelemekre is vonatkozik. A CSS-XHTML kztti kapcsolatot megoldhatjuk:
Beptett stluslapokkal. Csatolt stluslapokkal. Jellelembe rendelt stluslappal. Importlt stluslap segtsgvel.
A kvetkez fejezetekben csak az els kt CSS-XHTML kapcsolat megvalstst trgyaljuk.
2.2 Beptett stluslapok
A beptett stluslapokat az XHTML dokumentum fejrszben a:
< style type = text/css > stlusdefincik jellelem segtsgvel definiljuk. A type attribtum a stluslapra trtn hivatkozs formjt adja
meg (text/css).
A kvetkez egyszer plda kt beptett stlusdefincit tartalmaz amelyek a font tpusra, sznre
nagysgra s a h1 s h2 jellelemekre vonatkozik. Az els stlusdefinci a h1 jellelemre vonatkozik s elrja, hogy az sszes h1 jellelem
szvegblokkja Ariel tpus, piros szn s 18 pontos nagysg betvel jelenjen meg. A msodik
stlusdefinci a h2 jellelemre vonatkozik s elrja, hogy az sszes h2 jellelem szvegblokkja
Verdana tpus, fekete szn s 12 pontos nagysg betvel jelenjen meg.
-
64
Beptett stluslap plda
h1 { font-family: Arial; color: #ff0000; font-size: 18px; }
h2 { font-family: Verdana; color: #000000; font-size:12px; }
Intelligence everywhere The future is Fuzzy
2.4. kdrszlet Beptett stluslap plda A kdblokkunk forrsszvegt mentsk el a beepitettstiluslappelda.html nev llomnyba. Tltsk
be a megszerkesztett XHTML fjlt a webbngszbe, ekkor a 2.2. brn lthat eredmnyt kapjuk.
2.2. bra A feladat eredmnye a bngszprogramban
-
65
2.3 Csatolt stluslapok
A beptett stluslapok alkalmazsa tbb Web dokumentum esetben kt okbl nem clszer:
minden Web dokumentumhoz kln-kln le kell tlteni a stlusdefinickat (idignyes s hlzatterhel),
A stlusdefinci megvltoztatsa megkveteli a vltoztatst kln-kln minden Web dokumentumban.
A csatolt (kls) stluslapok hasznlata idelis arra az esetre, ha a Web dokumentjainknl ugyanazt
a stlus szeretnnk alkalmazni. Ez esetben a kls stluslapot mint szvegllomnyt (Text Only, Text
Document vagy ASCII) megszerkesztjk majd egy .css kiterjesztssel troljuk. Az gy elksztett
(kls) stluslapra a fejlc jellelembe hivatkozunk a kvetkez mdon:
ahol a href=url.css a .ccs llomny (relatv) elrsi tvonala. Clszer az XHTML
dokumentumot s a .css fjlt ugyanabban a knyvtrban elhelyezni! A kvetkez plda esetben csatolt stluslapot alkalmazunk a 2.3. brkon lthat pldnl (a font
tpusra, sznre s nagysgra vonatkozik alkalmazva a h1 s h2 jellelemekre). A kls
stluslapot mint szvegllomnyt megszerkesztjk majd stiluslap.css nven troljuk:
h1 {
font-family: Arial;
color: #ff0000;
font-size: 36px;
}
h2 {
font-family: Verdana;
color: #000000;
font-size:18px;
}
2.5. kdrszlet A stiluslap.css szvegllomnya Az gy elksztett kls stluslapra az XHTML dokumentum fejlc jellelembe hivatkozunk a
kvetkez mdon:
-
66
ahol a href=stiluslap.css a .ccs llomny (relatv) elrsi tvonala. Pldnknl az XHTML
dokumentumot s a stiluslap.css fjlt ugyanabban a knyvtrban helyeztk el! Az XHTML
dokumentum kdrszlete a kvetkez:
Csatolt stluslap plda
Intelligence everywhere
The future is Fuzzy
2.6. kdrszlet Az XHTML dokumentum
A kdblokkunk forrsszvegt mentsk el a csatoltstiluslap.html nev llomnyba. Tltsk be a
megszerkesztet XHTML fjlt az IE 6.0 bngszprogramba, ekkor a 2.3. brn lthat eredmnyt
kapjuk.
2.3. bra Az XHTML kdrszlet eredmnye a bngszprogramban
-
67
Ha pedig a csatolt stluslapnl a h1 s h2 jellelemekre ugyanazt a stlust szeretnnk alkalmazni,
akkor a stluslap j szvegllomnya a kvetkez:
h1, h2 {
font-family: Arial;
color: #ff0000;
font-size: 18px;
}
2.7. kdrszlet A stiluslap.css j szvegllomnya gy a csoportmegadsos csatolt stluslap (2.4. bra) eredmnye az IE 6.0 bngszprogramban a
kvetkez:
2.4. bra Az j stluslap eredmnye a bngszprogramban 3. Stlus osztlyok
A CSS technolgia lehetv teszi a stlusosztlyok ltrehozst. A stlusosztlyokat az XHTML
dokumentum fejrsznek style jellelemben adhatjuk meg. Az gy megadott stlusdefinci az
sszes olyan szvegblokkra vonatkozik, amelynl a nyit jellelem tartalmazza a megadott
stlusosztly nevt. Szvegmegjelentskor a nyit jellelem CLASS attribtumban
hivatkozhatunk a stluslapon definilt osztlyra. Ltrehozhatunk osztlyokat, amelyek az utd osztlyok alapjul szolglnak. Ezt nevezzk
rkldsnek, amely lehetv teszi, hogy az osztlyokbl (sosztlyok) j osztlyokat
szrmaztassunk (utd osztlyok). A utd osztlyok rklik s kiterjeszthetik az sosztly
tulajdonsgait, kivve, ha fellrjuk ket. Pldul ha a body jellelemet kkre lltjuk, akkor, mivel
a b jellelem a body-n bell van, a b jellelem kk sznben s flkvren jelenik meg.
-
68
3.1. Stlusosztlyok ltrehozsa egy adott ttelnven bell
Egy adott ttelnven bell szmtalan stlusdefinict hozhatunk ltre, melyeket egy-egy
osztlyazonostval klntnk el egymstl.
Pldul a 3.1. kdrszleten lthat stlusdefinci hatkre csak a news osztlyhoz tartoz h1
jellelemekre vonatkozik.
h1.news {
color: red;
}
3.1. kdrszlet A news osztlyhoz tartoz h1 jellelemekre vonatkoz stlusdeklarci 3.2. Beptett stlusosztlyok ltrehozsa
Egy beptett osztly esetn a stlusdefinic elejn csak az osztlynevet adjuk meg. Ez esetben a
stlusdefinic az sszes olyan szvegblokkra vonatkozik, amelynl a nyit jellelem tartalmazza
az adott osztlynevet. Teht a 3.2. kdrszleten lthat stlusdefinic hatkre minden news
osztlyhoz tartoz jellelemre vonatkozik.
.news{
color: red;
}
3.2. kdrszlet A news osztlyhoz tartoz stlusdeklarci A stlusosztlyok alkalmazst bemutatjuk a kvetkez plda esetben:
Bepitett stlusosztly plda
.nagy {
font-size: 36px;
}
-
69
Intelligence everywhere
The future is Fuzzy
3.3. kdrszlet A stlusosztly feladat kdblokkja
Ltrehoztuk teht a kvetkez stlusosztlyt:
.nagy {
font-size: 36px;
}
3.4. kdrszlet A .nagy osztlyhoz tartoz stlusdefinic A fejrszbe beptett osztly esetn a stlusdefinic elejn csak a .nagy osztlynevet adtuk meg.
Szvegmegjelentskor a span nyit jellelem CLASS attribtumban hivatkoztunk a stluslapon
definilt .nagy osztlyra. A pldnknl teht a .nagy osztly csak a span jellelem ltal kzrefogott
szveg (The future is Fuzzy) betnagysgt lltja be 36 pontra. A kdblokkunk forrsszvegt mentsk el a stilusosztaly.html nev llomnyba. Tltsk be a
megszerkesztett XHTML fjlt a webbngszbe, ekkor a 3.1. brn lthat eredmnyt kapjuk.
3.1. bra A stlusosztly feladat eredmnye a bngszprogramban Az XHTML dokumentumok stlusdefincija tbb osztlyt is tartalmazhat, amelyeket egymsba
gyazhatunk. Kt osztly alkalmazst szemlletesen bemutatjuk a kvetkez plda esetben:
-
70
Begyazott stlusosztly plda
.nagy { font-size: 36px; }
.szin { color: green; }
Intelligence everywhere The future is Fuzzy
3.5. kdrszlet A begyazott stlusosztly feladat kdblokkja A .nagy osztly utn ltrehoztuk a .szin stlusosztlyt is, amely zld szvegsznt llt be. A weblap
body rszben a .szin osztlyt alkalmazzuk az Intelligence everywhere szveg megjelentsre,
valamint begyaztuk a .nagy osztlyba a future szveg zld szn megjelentse cljbl. A
kdblokkunk forrsszvegt mentsk el a beagyazottosztaly.html nev llomnyba. Tltsk be a
megszerkesztet XHTML fjlt a webbngszbe, ekkor a 3.2. brn lthat eredmnyt kapjuk.
3.2. bra A begyazott stlusosztly feladat eredmnye a bngszprogramban
-
71
Az elz pldhoz viszonytva, most az Intelligence everywhere s a future szveg zld
sznben jelenik meg! Mivel a .szin osztly a .nagy osztlyba van gyazva, rkli a .nagy osztly
sszes belltsait (font-size: 36px). A .szin osztly csak azokat a bettpus-jellemzket vltoztatja
meg, amelyeket maga a .szin osztly ad meg (color:green).
4. Szvegformzs stluslapokkal
Az XHTML dokumentumban az informci egyik f hordozja a szveg. A szveg formzsa igen
fontos feladat s e clra a stluslapokat hasznljuk. A tovbbiakban rviden bemutatjuk a karakter
formzs CSS technolgijt.
4.1. Karakter formzs
Bettpusok kivlasztsa
A klnfle bettpusok felhasznlsval szleskr lehetsgeink vannak a megjelentend szveg
formzsra. A bettpusok kivlasztsnl a stlusdeklarci ltalnos alakja:
{font-family:name} ahol a nameegy vagy tbb kivlasztott bettpus neve. A font-family attribtummal teht egy
jellelem betkszlett adhatjuk meg. Pldk:
body {
font-family: Arial, Times New Roman,sans-serif;
}
4.1. kdrszlet Bettpusok kivlasztsa
h1, h2, h3 { font-family: Verdana, Courier,sans-serif; }
4.2. kdrszlet Bettpusok kivlasztsa
Clszer teht tbb bettpust kivlasztani mivel nem biztos, hogy minden bngsz rendelkezik a
fontkszletnkkel. A font-family rkldik.
Dltbets betformtum
Dltbets betformtumot eredmnyez a kvetkez stlusdeklarci:
-
72
{font-style : italic} vagy
{font-style: oblique}
Plda:
p { font-style: italic; }
4.3. kdrszlet Dltbets betformtum
A dltbets formtumot a kvetkez stlusdeklarcival vltoztathatjuk meg:
{font-style: normal} A font-style rkldik. Betvastagsg
A betvastagsgot a kvetkez stlusdeklarci alkalmazsval hatrozzuk meg:
{font-weight: value} ahol a value lehetsges rtkei: value: normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 A fenti rtkek esetben:
normal = 400
bold = 700
Plda:
p { font-weight: lighter; }
4.4. kdrszlet Betvastagsg megadsa
A flkvr bold - betformtumot a kvetkez stlusdeklarcival vltoztathatjuk meg:
{font-weight: normal} A font-weight rkldik.
Betmret
A betmretet (betnagysg) a kvetkez stlusdeklarci alkalmazsval hatrozzuk meg:
{font-size: value} ahol a value lehetsges rtkei:
-
73
value: absolute-size | relative-size | length | percentage absolute-size (abszolt-mret): xx-small | x-small | small | medium | large | x-large | xx-large |
Plda: p {
font-size: xx-large; }
4.5. kdrszlet Abszolt-betmret
relative-size (relatv-mret): larger | smaller Plda:
p { font-size: larger; }
4.6. kdrszlet Relatv-betmret
length:
Length centimeters ems inches millimeters picas pixels points
rvidts Cm em in mm pc px pt
4.1. tblzat Plda:
p { font-size: 16pt; }
4.7. kdrszlet Pontokban megadott betmret
percentage (szzalkrtk): a kivlasztott szzalkkal nveli vagy cskkenti a betnagysgot. Plda:
p { font-size: 80%; }
4.8. kdrszlet Szzalkrtkkel megadott betmret A font-size rkldik.
Kiskapitlis forma
A kiskapitlis formt (kisbets mret nagybetk) a kvetkez stlusdeklarci alkalmazsval
hatrozzuk meg:
{font-variant: value}
-
74
ahol a value lehetsges rtkei:
value: normal | small-caps Plda:
h2 { font-variant: small-caps; }
4.9. kdrszlet Kiskapitlis forma
A kiskapitlis formtumot a kvetkez stlusdeklarcival vltoztathatjuk meg:
p{font-variant: normal} A font-variant rkldik. 4.2. Szvegformzs
Sorkz
A sorok kztti tvolsgot a kvetkez stlusdeklarci alkalmazsval hatrozzuk meg:
{line-height: value} ahol a value lehetsges rtkei:
value: normal | number | length | percentage A normal rtk vltozatlanul hagyja a sorok kztti tvolsgot. A megadott szmot (number) a
betmret szorzszmaknt alkalmazzuk. A lenght a sormagassg abszolt rtkt jelenti. A
szzalkrtk (percentage) a betmretre vonatkozik. Pldk:
{ line-height: 1.2 } /* number */ 4.10. kdrszlet number sorkz llts
{ line-height: 1.2em } /* length */ 4.11. kdrszlet length sorkz llts
{ line-height: 150% } /* percentage */
4.12. kdrszlet percentage sorkz llts
A line-height rkldik.
Szkz
A szkzt a kvetkez stlusdeklarci alkalmazsval hatrozzuk meg:
{word-spacing: value}
-
75
ahol a value lehetsges rtkei:
value: normal |length rtke lehet negatv is, ez esetben cskethetjk a szavak kzti tvolsgot. Plda (em az m bet szlessge):
h1 { word-spacing: 1em; }
4.13. kdrszlet Szkzbellts
A word-spacing rkldik.
Betkz
A betkzt a kvetkez stlusdeklarci alkalmazsval hatrozzuk meg:
{letter-spacing: value} ahol a value lehetsges rtkei: value: normal |length Plda:
BLOCKQUOTE { letter-spacing: 0.1em; }
4.14. kdrszlet Betkz bellts
A letter-spacing rkldik.
Szvegdszts
A szveg kiegszt dsztst hatrozza meg, stlusdeklarcija:
{text-decoration: value} ahol a value lehetsges rtkei: value: none | [ underline || overline || line-through || blink ]
none semmi, underline alhzott, overline fellhzott, line-through thzott, blink villog.
-
76
Plda: {text-decoration: overline}
4.15. kdrszlet Szvegdszts
Vzszintes szvegblokk igazts
A szvegblokk vzszintes igaztst a kvetkez stlusdeklarci alkalmazsval hatrozzuk meg:
{text-align: value} ahol a value lehetsges rtkei: value: left | right | center | justify
left balra igaztott bekezds,
right jobbra igaztott bekezds,
center kzpre igaztott bekezds,
justify szvegblokk sorkiegyenltett elrendezse. Plda:
p { text-align: center; }
4.16. kdrszlet Kzpre igaztott bekezds
A text-align rkldik.
A bekezdsek els sornak behzsa
A bekezdsek els sornak behzst a bal margtl a kvetkez stlusdeklarci alkalmazsval
hatrozzuk meg:
{text-indent: value} ahol a value lehetsges rtkei:
value: length | percentage Plda:
p { text-indent: 2em; }
4.17. kdrszlet A bekezdsek els sornak behzsa a bal margtl
A text-indent rkldik.
-
77
Kisbet-nagybet csere
talaktja a szveg kis- s nagybetit. A kisbet-nagybet csert a kvetkez stlusdeklarci
alkalmazsval hatrozzuk meg:
{text-transform: value} ahol a value lehetsges rtkei: value: capitalize | uppercase | lowercase | none
capitalize minden sz els betjt nagybetvel rja ki, uppercase minden bett nagybetre cserl, lowercase minden bett kisbetre cserl, none semmi (megmaradnak az eredeti betmretek).
Plda:
h1 { text-transform: uppercase; }
4.18. kdrszlet A kisbet-nagybet csere
A text-transform rkldik.
5. Eltrszn-httrszn
5.1. Eltrszn
Az eltrsznt (szvegszn) a kvetkez stlusdeklarci alkalmazsval hatrozzuk meg:
{color: value} ahol a value lehetsges rtkei megadhatk: Nvvel - colorname - 16 szabvnyos sznnvvel a kvetkez tblzat szerint:
Sznnevek s hexadecimlis/RGB rtkek tblzata
aqua #00ffff rgb(0,255,255)
gray #808080 rgb(128,128,128)
silver #c0c0c0 rgb(192,192,192)
navy #000080 rgb(0,0,128)
black #000000 rgb(0,0,0)
green #008000 rgb(0,128,0)
teal #008080 rgb(0,128,128)
olive #808000 rgb(128,128,0)
blue #0000ff rgb(0,0,255)
lime #00ff00 rgb(0,255,0)
white #FFFFFF rgb(255,255,255)
purple #800080 rgb(128,0,128)
fuchsia #ff00ff rgb(255,0,255)
maroon #800000 rgb(128,0,0)
yellow #ffff00 rgb(255,255,0)
red #ff0000 rgb(255,0,0)
4.2. tblzat
-
78
Plda: p {
color: navy; }
5.1. kdrszlet Eltrszn bellts szabvnyos sznnvvel
Hex rtkkel - #rrggbb - hexadecimlisan, ahol az rrggbb a szn hexadecimlis kdja a fenti
tblzat szerint.
Plda: p {
color: #000080; }
5.2. kdrszlet Eltrszn bellts Hex rtkkel
rgb rtkkel - rgb(r,g,b) - n. rgb sznekkel a fenti tblzat szerint. Plda:
p { color: rgb(0,0,128); }
5.3. kdrszlet Eltrszn bellts rgb sznekkel
Az alaprtelmezett eltrszn: fekete (black). A color attribtum teht egy jellelem szvegsznt
lltja be! A color rkldik.
5.2. Httrszn
Ez az attribtum egy jellelem httrsznt lltja be (nem pedig az egsz oldalt). A httrszn
belltst kvetkez stlusdeklarci alkalmazsval hatrozzuk meg:
{background-color: value} ahol a value lehetsges rtkei megadhatk: color - 16 szabvnyos sznnvvel vagy hexadecimlis mdon a fenti tblzat szerint. Pldk:
pre {
background-color: red;
} 5.4. kdrszlet Httrszn bellts szabvnyos sznnvvel
-
79
pre { background-color: #ff0000; }
5.5. kdrszlet Httrszn bellts Hex rtkkel
transparent tltsz (ltszik a mgtte lv szveg szne). Plda:
pre { background-color: transparent; }
5.6. kdrszlet tltsz httrszn bellts 5.3. Httrsznmegads kppel
Ha a httrsznt kppel adjuk meg stlusdeklarcija:
{background-image: url(image.gif)} Ez az attribtum egy jellelem (nem a teljes oldal) httrkpt lltja be. Plda:
p { background-image: url(marble.gif); }
5.7. kdrszlet Httrszn bellts kppel
A kp megadsa esetn az url utn berhatk a kvetkez n. uttagok:
repeat a kpet vzszintesen s fgglegesen ismtelve jelenti meg, Plda:
pre { background-image: url(marble.gif); background-repeat: repeat; }
5.8. kdrszlet repeat httrszn bellts kppel
repeat-x a kpet csak vzszintesen ismtelve jelenti meg, Plda:
body { background-image: url(marble.gif); background-repeat: repeat-x; }
5.9. kdrszlet repeat-x httrszn bellts kppel
-
80
repeat-y a kpet csak fgglegesen ismtelve jelenti meg, Plda:
body { background-image: url(marble.gif); background-repeat: repeat-y; }
5.10. kdrszlet repeat-y httrszn bellts kppel
no-repeat csak egyszer jelenti meg a kpet. Plda:
pre { background-image: url(marble.gif); background-repeat: no-repeat; }
5.11. kdrszlet no-repeat httrszn bellts kppel
5.4. Httrfggelk
A httrfggelk (httrkp) stlusdeklarcija:
{background attachment: value} ahol a value lehetsges rtkei:
value: scroll | fixed A scroll vagy fixed uttag meghatrozza, hogy ha van belltott httrfggelk (httrkp), az fixen
marad-e vagy a tartalommal egytt grdthet. Plda:
body { background-image: url(marble.gif); background-repeat: repeat; background- attachment: scroll; }
5.12. kdrszlet scroll httrfggelk bellts
pre { background-image: url(marble.gif); background-repeat: repeat; background- attachment: fixed; }
5.13. kdrszlet fixed httrfggelk bellts
Megjegyzs: A szvegformzst rendszerint egy stlusdeklarcval oldjuk meg.
-
81
XHTML s CSS tfog feladat Jegyzettmb segtsgvel ksztse a mellkelt Weblapot XHTML s CSS technolgik
alkalmazsval.
1.1. bra Feladatmegads
A Weblap tartalmazzon:
XHTML-1.0- Transitional DTD-t, csatolt stluslapot, 3 stlusosztlyt s 4 kapcsolatot.
Mutassa be a bngszben a feladatok XHTML s CSS forrskdjait, valamint a Weblapot.
Megoldsok:
A feladat XHTML kdblokkja:
XHTML s CSS
-
82
XHTML s CSS technolgik
XHTML
CSS
Dunajvrosi Fiskola
e-tananyag
Az XHTML (Extensible HyperText Markup Language) egy struktrban
gazdag jellnyelv, amely a megjelentst a stluslapokra bizza, modulris alapokra pl s egyttmkdik
az XML (Extensible Markup Language) alap felhasznli alkalmazsokkal. Az XHTML jellnyelv
megjelense s alkalmazsa az internet fejldsnek egy fontos lpcsfokt jelenti. A tovbbiakban az
XHTML 1.0 SE (msodik kiads) verzijval foglalkozunk (XHTML 1.0 ajnls: 2000. janur 26;
fellvizsglva: 2002. augusztus 1.)
A W3C (World Wide Web Consortium) hozta ltre a CSS (Cascading Style
Sheet- lpcszetes stluslapok) specifikcit. A CSS technolgia alkalmazsnak alapvet clja: bevezetni a
stluslapok (Style Sheet) alkalmazst az XHTML dokumentum formzsi utastsai helyet, s sztvlasztani
az XHTML dokumentum tartalmi rszt a megjelentsi stlusjellelemektl.
1.1. kdrszlet A feladat XHTML kdblokkja
A feladat CSS forrskdja:
h1 {
font-family: Verdana;
color:#ff0000;
font-size: 30;
}
.szoveg1{
-
83
font-family: Arial;
color:#800000;
font-size: 16;
}
.szoveg2{
font-family: Arial;
color:#008000;
font-size: 16;
}
1.2. kdrszlet A feladat stillap.css szvegllomnya
1.2. bra Ellenrztt, a W3C ajnlsainak megfelel XHTML dokumentum
-
84
_________________________________________________________
PHP nyelv
_________________________________________________________
1. Alapfogalmak
A PHP szerveroldali internet-programozsi, nylt forrskd, platformfggetlen szkript nyelv, a
dinamikus, interaktv weboldalak ltrehozsnak egyik legegyszerbb s leghatkonyabb eszkze.
A PHP rvidts a Hypertext Preprocessor elnevezsbl ered. A PHP forrsprogram elksztett
forrskdjt elszr interpreter segtsgvel rtelmezzk s a programfuts alatt lefordtjuk a
szmtgp gpi kdjra. A World Wide Web gyors fejldse s elterjedse kvetkeztben a PHP
els vltozatt Personal Home Page Tools nven Rasmus Lerdorf ksztette 1994-ben. A knyv
rsnak a pillanatban az ajnlott PHP verzi: 4.3.6. A PHP webes programozsi nyelv,
alkalmazsval az adatbzisok kezelse igen egyszer. A PHP programok jl hordozhatak s biztonsgosak. Egyttmkdnek klnbz szerverekkel,
opercis rendszerekkel s adatbzis kezelkkel. A PHP teht:
szerveroldali begyazott nyelv ingyenes keresztplatformos s szleskrben elterjedt.
A PHP egyik legelterjedtebb alkalmazsa az Apach webszerverbl s a MySQL
adatbzisrendszerbl ll PHP-Apache-MySQL egyttes (PHP Triad). A PHP Triad webcme:
http://www.sourceforge.net/projects/phptriad/
ahonnan a PHP-Apache-MySQL egyttes (phptriad2-2-1.exe) ingyenesen letlthet. Komolyabb
munka szempontjbl viszont clszerbb a PHP rtelmezt, az Apache webkiszolglt s a s
MySQL adatbziskezel programot kln kln telepteni!
-
85
A PHP szerveroldali begyazott nyelv. A PHP programok a szerveren futnak le oly mdon, hogy a
megfelel kiterjeszts llomnyt a PHP rtelmez:
tfsli,
rtelmezi,
azokat megfelel mdon vgrehajtja, s
a kimeneteket beilleszti a HTML-oldalba.
A felhasznl csak a programunk ltal generlt tartalmat ltja, s nem magt a PHP programot. A
szerveroldali programozs (Server-Side Scripting) esetben a szerveroldali szkriptek a Web
szerveren futnak le s dinamikus HTML oldalakat hoznak ltre. A szerveroldali programozs
elnye knnyen megrthet a kvetkez pldbl: Clkitzs: az aktulis dtum leolvassa a Web laprl.
Statikus HTML oldalon minden nap be kell rni az aktulis dtumot. A PHP technolgia lehetv teszi egy szkript megrst amely a beolvasott Web rlapon
megjelenti az aktulis dtumot. Mieltt a felhasznl beolvassa a Web lapot, a szerver lefutatja a
szkriptet s gy a beolvasott Web lapon mindig az aktulis dtum jelenik meg. A szerveroldali programozs tbb szempontbl is elnys a Web fejleszt szmra:
1. A szerveroldali szkriptek fejlesztse teljesen fggetlen a felhasznl ltal alkalmazott
bngsztl. gy a szerveroldali szkripteket olyan programnyelvben is fejleszthetjk amelyet a
felhasznl bngszje nem tmogat.
2. A szerveroldali szkriptek forrsnyelvi vltozata nem olvashat a felhasznl bngszjben. Ez
a tny igen fontos a forrsnyelvi vltozat vdettsge szempontjbl (biztostja a PHP
programfejleszt szerzi jogait.).
3. A letltend HTML dokumentum mrete cskken (mivel a bngszben csak a szerveroldali
szkriptek vgrehajtsi eredmnye ltszik). gy a Web oldal beolvassa is gyorsabb.
4. Egy szerveroldali komponens alkalmazsval leolvashatjuk a felhasznl gp opercis
rendszert s bngszprogramjt, gy a szerveroldalrl lekldtt HTML dokumentum a
kliens gp krnyezetre alakthat.
5. A PHP program az adatbzis szerverrl adatbzist hasznlhat fel a megjelentend Web lap
feldolgozsra.
A PHP nyelv alkalmazsnak legfontosabb lehetsgei:
hatkony fjlkezels, vltozk rugalmas hasznlata, a tmbk rugalmas hasznlata,
-
86
regulris kifejezsek hasznlata, kpek ksztse s manipulcija, adatbzisrendszerek igen szles krnek hasznlhatsga.
A ZDNet (www.zdnet.com) sebessgteszt eredmnyei a programnyelvek alkalmazsa
szempontjbl az egy msodperc alatt ellltott oldalak szmt tekintve:
PHP 47 oldal ASP 43 oldal Allaire (Macromedia) Coldfusion 29 oldal SUN Java JSP 13 oldal
2. A PHP programfejleszts eszkzei
A PHP programok elksztse szempontjbl a kvetkez eszkzkre lesz szksgnk: a. PHP-rtelmez
Elszr be kell szereznnk, teleptennk s belltanunk az opercis rendszernkhz megfelel
PHP-rtelmezt. A PHP hivatalos webhelye:
http://www.php.net ahonnan ingyenesen letlthet.
b. Szvegszerkeszt
A PHP forrsprogram megszerkesztsre szolgl. Megfelel brmilyen egyszer szvegszerkeszt,
amely formzs nlkli ASCII-szveget llt el (ltalban minden opercis rendszerben
megtallhat), pldul a Jegyzettmb (Notepad). A PHP forrsprogram fjlainak kiterjesztse:
.php
Knyelmesebb munka szempontjbl clszerbb a HTML-kit hasznlata, webcme:
http: //www.chami.com/html-kit)
vagy a ConText ingyenes kdszerkesztket alkalmazni amelyek rendelkeznek kdsznezssel s kifejezs-szerkesztvel.
A PHP programfejleszts leghatsosabb eszkze a:
Macromedia Dreamweaver MX 2004 hasznlata, webcme:
http: //www.macromedia.com
-
87
c. Webbngsz
A Webbngsz a PHP programok kimenetnek a kliens szmtgpen val megjelentsre
szolgl. Clszer alkalmazni a szleskren hasznlt webbngszket mint pldul a:
Opera Mozilla Microsoft Internet Explorer Netscape Navigator.
d. Webkiszolgl
Az Apache webkiszolgl a legnpszerbb nylt forrskd s platformfggetlen webkiszolgl. Az
Apache program ingyenesen letlthet az Internetrl az Apache cg Web cmrl:
http://www.apache.org
Ha az Apache webkiszolglt a sajt szmtgpnkre teleptjk, akkor is a szmtgpnk IP cme:
127.0.0.1 neve pedig:
localhost
lesz. Teht, ha a bngsznkkel az Apache webkiszolgl gykrknyvtrban lv
program_01.php fjlt szeretnnk megnyitni, akkor a fjlt kvetkez cmen rhetjk el:
http://localhost/program_01.php
e. Adatbziskezel
Szmos adatbziskezel program kzvetlenl alkalmazhat a PHP-vel. Legelterjedtebb
adatbziskezel program a nylt forrskd, gyors s egyszeren kezelhet:
MySQL A MySQL adatbzisrendszer webcme:
http://www.mysql.com
ahonnan a MySQL adatbziskezelprogram ingyenesen letlthet. A webalap:
phpMyAdmin
fellet nagy segtsget nyjt az adatbziskezelsnl, webcme:
http://www.phpmyadmin.net
Ingyenes szolgltatk PHP programok futtatsra: http://www.freeweb.hu
http://www.ultraweb.hu
http://www.free-php-hosting.com
http://www.free-php.cjb.net
-
88
3. Programkszts a PHP fejleszti krnyezetben
Ha a szmtgpnkn rendelkeznk megfelel szvegszerkesztvel amely ASCII-szvegknt
ment, pl. Jegyzettmb s helyesen teleptett PHP fejleszti krnyezettel, akkor bemutathatunk
hrom egyszer PHP programot. A tovbbiakban felttelezzk, az Apache webkiszolglt a sajt
szmtgpnkre teleptettk.
3.1. Els PHP programunk
Egy egyszer PHP program ellltsa a kvetkez lpsekbl ll:
1. Hvjuk be a Jegyzettmbt, nyissunk meg a szerkesztben egy j llomnyt s gpeljk be
pldaknt a kvetkez PHP forrskd szvegt.
1:
3.1. PHP szkript Az els PHP programunk forrskdja
A fenti pldbl lthat, hogy a PHP program nyiteleme: . A nyit- s zrelemek kzz rjuk be a PHP program utastsait. Az utasts vgn ktelez az ; utasts-
vgjel. A programunkban csak egy utastst hasznltunk a:
print (Hello from PHP);
fggvnyt, amely egy karakterlncot r ki a kpernyre. Gpels kzben gyeljnk arra, hogy a
PHP klnbsget tesz a kis- s nagybetk kztt! A forrsszveget mentsk el az Apache szerver
gykrknyvtrban (pl. c://apache/htdocs) hello nv alatt php kiterjesztssel. 2. A http://127.0.0.1/hello.php webcm begpelsvel tltsk be a megszerkesztet PHP fjlt a
webbngszbe, ekkor a PHP program a webkiszolgln vgrehajtdik s a kvetkez brn a
program kimenett lthatjuk a web-bngszben
3.1. bra A 3.1. PHP szkript kimenete a webbngszben
-
89
3.2. HTML oldal PHP programmal
A PHP kd beptse egy HTML oldalba egyszeren a PHP kdblokk bersbl ll az HTML
elemek kz. Egy HTML dokumentumba tetszleges szm PHP kdblokk rhat. A kvetkez
pldban, amely HTML s PHP kdot tartalmaz egy oldalon, bemutatjuk az aktulis dtum
leolvasst a Web laprl:
1. Hvjuk be a Jegyzettmbt, nyissunk meg a szerkesztben egy j llomnyt s gpeljk be a
kvetkez HTML s PHP forrskd szvegt.
1: 2: 3: PHP datumkezeles 4:
5: 6: A mai dtum: 7: 10: 11:
3.2. PHP szkript A HTML/PHP program forrskdja A PHP kdblokkban felhasznlt Date() fggvny a dtumot formzott karakterlnc formjban adja
vissza. A forrsszveget mentsk el az (aktv) Apache szerver gykrknyvtrban datum.php
nven.
2. A http://127.0.0.1/datum.php webcm begpelsvel tltsk be a megszerkesztet PHP fjlt a
webbngszbe. Mieltt a felhasznl beolvassa a Web lapot, a szerver lefutatja a szkriptet s gy a
beolvasott Web lapon mindig az aktulis dtum jelenik meg:
3.2. bra Az aktulis dtum megjelentse
-
90
3.3. Adatfeldolgozs
A kvetkez pldnl a HTML s PHP kdot kln llomnyban troljuk:
1. Hvjuk be a Jegyzettmbt, nyissunk meg a szerkesztben egy j llomnyt s gpeljk be egy
egyszer HTML rlap forrskdjnak a szvegt.
1: 2: 3: xHTML rlap 4: 5: 6: 7: 8: 9: 10: 11:
3.3. PHP szkript Az xHTML rlap forrskdja Egy HTML rlapot hoztunk ltre, amely egy tetszolegesnev szvegmezt s egy gombot
tartalmaz. A form jellelem action attribtuma a pingvin.php fjlra mutat, amely feldolgozza az
rlapon megadott adatot (a HTML s PHP fjloknak most egy knyvtrban kell lennik!). A
forrsszveget mentsk el az (aktv) Apache szerver gykrknyvtrban html_urlap.html nven. 2. rjuk meg a kvetkez pingvin.php nev PHP programot, amely kirja a felhasznl ltal
megadott adatot:
1:
-
91
3.3. bra A HTML rlap szvegmezjnek kitltse
4. Ekkor meghvdik a pingvin.php nev program a szerveren, amely a felhasznl bngszjben
kirja az dvzlszveget.
3.4. bra Az dvzlet megjelentse
Fontos megjegyzs: A HTML rlap action attribtumnak a pingvin.php rtke s a php program
pingvin.php neve megegyez kell hogy legyen! A fenti pldbl lthat, hogy a PHP programok alkalmazsval milyen egyszeren kezelhetek a
HTML rlapok.
4. A PHP nyelv alkotelemei
4.1 PHP opertorok
A PHP-ben az opertoroknak tbb tpusa is ltezik, amelyekkel alakthatjuk az adatokat.
-
92
Aritmetikai opertorok
A PHP-ben hasznlhat aritmetikai opertorok a kvetkezk:
PHP opertor A mvelet jelentse Plda Eredmny
+ sszeads $x=3 $x+5 8
- kivons $x=4 6-$x 2
* szorzs $x=2 4*x 8
/ oszts 20/4 5
% maradkkpzs 7%3 1
Relcis opertorok
A PHP-ben hasznlhat relcis (sszehasonlt) opertorok a kvetkezk:
A mvelet jelentse PHP opertor Plda rtk egyenl = = 6==7 hamis
rtk nem egyenl ! = 6!=7 igaz
rtk s tpus egyenl = = = = = =
kisebb < 6 7>6 igaz
kisebb vagy egyenl =7 hamis A PHP-ben hasznlhat a (.) karakterlnc sszefz opertor is. Plda:
Auto . mobil kifejezs rtke:
Automobil rtkad opertorok
A PHP-ben hasznlhat rtkad opertorok a kvetkezk:
PHP opertor A mvelet jelentse Plda Ezzel egyenrtk= rtkads $x=$y $x=$y
+= sszeads s rtkads $x+=$y $x=$x+$y
- = kivons s rtkads $x- = $x=$x-$y
*= szorzs s rtkads $x*=$y $x=$x*$y
/= oszts s rtkads $x/=$y $x=$x/$y
%= egsz oszts s rtkads $x%=$y $x=$x%$y
.= konkatenls $x.= szveg $x=$x. szveg
-
93
Fontos megjegyezni, hogy mi a klnbsg az =
s az = =
kztt. Az elsvel rtket rendelnk valamihez, a msodikkal pedig rtkeket hasonltunk ssze.
Logikai opertorok
A PHP-ben hasznlhat logikai opertorok a kvetkezk: PHP opertor A mvelet jelentse A mvelet jelentse
! negci Az egyetlen operandus sem igaz and logikai s mvelet Igaz a bal s a jobb oldal is
&& logikai s mvelet Igaz a bal s a jobb oldal is or logikai vagy mvelet Vagy a jobb vagy a bal oldal igaz || logikai vagy mvelet Vagy a jobb vagy a bal oldal igaz
xor logikai kizr vagy Vagy a jobb igaz, vagy a bal, de nem mind a kett
4.2. A mveletek kirtkelsi sorrendje
A mveletek elsbbsgt cskken sorrendben a kvetkez tblzatban mutatjuk be:
! ++ -- (tpus-talakts)
/ * %
+ - .
< >
= = = = = = ! = ! = =
&&
||
= + = - = / = % = . =
and
xor
or
4.3. Konstansok
A PHP-ben a konstansokat:
define()
fggvnnyel deklarljuk. A konstansok hasznlatval azt rjk el, hogy a program futsa sorn az
adott nv alatt trolt rtk nem vltozik. A konstans nevt mint karakterlncot s a trolt rtket
vesszvel elvlasztva a zrjelbe nagybetvel rjuk s nem tartalmaz dollrjelet. Plda:
define (Pi , 3.14159);
-
94
4.4. Vltozk
A PHP program az adatokat (szmokat, karakterlncokat, objektumokat, tmbket s logikai
rtkeket) vltozkban trolja. Minden vltoznak van neve s adattpusa. A vltoz deklarlshoz
egy dollrjel $ s egy tetszlegesen vlasztott nv szksges. A nv betket, szmokat s alhzs
karaktereket tartalmazhat, szmmal azonban nem kezddhet. Amikor a vltozt ltrehozzuk
rendszerint rtket is adunk a vltoznak. Pldk:
$x;
$y=10;
$z=Karakterlnc;
Pldk helyes s helytelen vltoznevekre:
Helyes:
$els = 10;
$reakci_id = 0.8;
Helytelen:
$1els = 10;
(szmmal nem kezddhet)
$reakci id = 0.8;
(szkzt nem tartalmazhat)
A vltozk nevnl a kis- s nagybetk nem egyenrtkek! Plda hrom klnbz vltozra:
$tl
$tl
$TL
Az inkrementl (nvel) opertor a vltoz rtkt nveli meg eggyel:
$a++;
Hasonlkppen mkdik cskkentsre:
$a--;
formban. Ezeket az opertorokat leginkbb ciklusokban hasznljuk gyakran valamely vltoz
rtknek lptetsre. A kvetkez pldban, a $szoveg vltozhoz, a Hello from PHP karakterlncot rendeljk:
1: 2: 3: PHP vltoz 4:
5:
-
95
6: 9: 10:
4.1. PHP szkript A PHP vltoz
A kdblokkunk forrsszvegt (4.1. PHP szkript) mentsk el az Apache webkiszolgl
gykrknyvtrba. Tltsk be a megszerkesztet fjlt a webbngszbe, ekkor a PHP program a
webkiszolgln vgrehajtdik s a kpernyn a kvetkez eredmnyt kapjuk:
Hello from PHP 4.5. Adattpusok
A PHP-ben 6 adattpussal rendelkeznk. A PHP automatikusan felismeri a vltozk adattpust.
Egy vltoz az rtkadskor klnfle szmadattpust vehet fel:
Integer (egsz tpus),
Double (lebegpontos).
Feltlthetjk szveges adattal:
String (karakterlnc, karakterek sorozata), logikai adattal:
Boolen (csak True vagy False logikai rtket vehet fel),
hozzrendelhetnk objektumot is:
O