Szeretnénk egy honlapot az internetre feltölteni, de nem tudjuk hogyan kezdjünk bele ? Egyszerű, kell egy weblap és egy kiszólgáló/szerver ahova regisztráljuk magunkat ez lehet ingyenes, vagy fizetős (domain név ) Itt találsz egy kis linkgyűjteményt ingyen tárhelyekről.
Elsőnek kell egy weblap amit fel szeretnénk tölteni.
Nézzünk egy példát. Tölts le egy üres lapot html szerkezettel. Ha ezt átnevezed index.html - nek akkor ez lesz a kezdőlapod. Nem kell külön beírni semmit, csak amit regisztráltál nevet, mondjuk Jani.uw.hu akkor az index.html fog bejönni mint kezdőlap és a rajta lévő tartalom. Az index.html fájl-t ne mappába töltsd fel, hanem a gyökérkönyvtrába.
Gyökérkönyvtár: Amit közvetlenül töltesz fel a szerverre és nincs külön mappában. A gyökérkönyvtár jön be ha csatlakozol total commanderrel, amit ide teszel, azt közvetlen eléréssel tudod elérni. Ha például feltöltesz egy képet aminek a neve 1.gif akkor az elérése 1.gif lesz. Ha a gyökérkönyvtárba töltesz fel egy images mappát és abba teszed a képet, akkor az elérése: images/1.gif lesz. Ha ezt az üres lapot átnevezted és feltöltötted a regsiztrált oldaladra be kell jönnie a rajta lévő tartalomnak.
A lenti példa egy egyszerű példa a html szerkezet felépítésére. A <html> a böngészőnek mutatja meg, hogy ez nem egy szövegfájl, hanem egy html szerkezetű weblap.. a <head> ez a nyitótag. <title>...</title> Ez az oldalad címe amit adsz a weblapodnak, célszerű olyat megadni ami jellemzi a honlapodat. Felül a fejlécen fog megjelenni.</head>fejléc vége.<body bgcolor=... a háttérszín, betűszin, hivatkozás szine és a már látogatott link szine határozható meg. ( black helyett használhatsz pl #000000 szinkódot is.
<body> Innen követketzik a tartalma a honlapnak.
Ez egy példa ez fog megjelenni. </body> a szöveg/törzs vége.</html> Így végződik a html dokumentumod.
Kész is van az index.html azaz a kezdőlapunk, de ez így túl üres.....
2.Lecke
Táblázatok, cellák.
Miért van szükségünk táblázatokra ? Mert sokan más más képernyőfelbontást használunk és ha nem szeretnénk, hogy egy szöveg szétcsússzon, mindenkinél máshol jelenjen meg, akkor táblázatot kell alkalmaznunk. Egy egyszerű példa táblázat. Ha a magasságot akarod megadni egyszerűen hozzáírod az első sorhoz, így fog kinézni: <table border="1" width="300" height="40">
<table border="1" width="300">
<tr>
<td>
<p>1sor/1cella</p>
</td>
<td>
<p>1sor/1cella</p>
</td>
</tr>
<tr>
<td>
<p>2sor/1cella</p
</td>
<td>
<p>2sor/2cella</p>
</td>
</tr>
</table>
Eredmény::
|
1sor/1cella |
1sor/1cella |
|
2sor/1cella |
2sor/2cella |
Nézzük középre igazítva a szöveget.
<table border="1" width="300">
<tr>
<td>
<p align="center">1sor/1cella</p>
</td>
<td>
<p align="center">1sor/1cella</p>
</td>
</tr>
<tr>
<td>
<p align="center">2sor/1cella</p>
</td>
<td>
<p align="center">2sor/2cella</p>
</td>
</tr>
</table>
Eredmény:
|
1sor/1cella |
1sor/1cella |
|
2sor/1cella |
2sor/2cella |
Nézzük ugyanazt a táblát kicsit másképp: Ha nem px(pixelt) adsz meg méretnek hanem üresen hagyod, akkor az opera és mozilla másképp jeleníti meg !
<table width="300" style="border-width:1px; border-color:black; border-style:solid;" cellpadding="0" cellspacing="0">
<tr>
<td bgcolor="##66CCFF" style="border-width:1px; border-color:red; border-style:solid;">
<p align="center">1sor/1cella</p>
</td>
<td bgcolor="#6699FF" style="border-width:1px; border-color:red; border-style:solid;">
<p align="center">1sor/1cella</p>
</td>
</tr>
<tr>
<td>
<p align="center">2sor/1cella</p>
</td>
<td>
<p align="center">2sor/2cella</p>
</td>
</tr>
</table>
Eredmény:
|
1sor/1cella |
1sor/1cella |
|
2sor/1cella |
2sor/2cella |
Vagy kombinálhatjuk is:
<table width="300" style="border-width:1px; border-color:black; border-style:none;" cellpadding="0" cellspacing="0">
<tr>
<td style="border-top-width:1px; border-right-width:0px; border-bottom-width:1px; border-left-width:1px; border-color:black; border-style:dashed;">
<p align="center">1sor/1cella</p>
</td>
<td style="border-top-width:1px; border-right-width:1px; border-bottom-width:1px; border-left-width:0px; border-color:black; border-style:dashed;">
<p align="center">1sor/1cella</p>
</td>
</tr>
<tr>
<td bgcolor="#6699FF" style="border-width:1px; border-color:black; border-style:solid;">
<p align="center">2sor/1cella</p>
</td>
<td bgcolor="#6699FF" style="border-width:1px; border-color:black; border-style:solid;">
<p align="center">2sor/2cella</p>
</td>
</tr>
</table>
Eredmény:
|
1sor/1cella |
1sor/1cella |
|
2sor/1cella |
2sor/2cella |
Nézzünk egy táblázatot, amelyben a szöveget igazitjuk.
<table width="300" style="border-width:1px; border-color:black; border-style:solid;" cellpadding="0" cellspacing="0" height="100">
<tr>
<td bgcolor="#6633FF" style="border-width:1px; border-color:red; border-style:solid;" align="left" valign="baseline">
<p>1sor/1cella</p>
</td>
<td bgcolor="#6699FF" style="border-width:1px; border-color:red; border-style:solid;" align="center" valign="middle">
<p>1sor/1cella</p>
</td>
</tr>
<tr>
<td align="left" valign="bottom" bgcolor="#CC6600">
<p>2sor/1cella</p>
</td>
<td align="right" valign="bottom" bgcolor="#6666FF">
<p>2sor/2cella</p>
</td>
</tr>
</table>
Eredmény:
|
1sor/1cella |
1sor/1cella |
|
2sor/1cella |
2sor/2cella |
Igazítsuk a táblát a táblázatban.
<table border="1" width="300" align="center">
<tr>
<td>
<p>1sor/1cella</p>
</td>
<td>
<p>1sor/1cella</p>
</td>
</tr>
<tr>
<td>
<p>2sor/1cella</p>
</td>
<td>
<p>2sor/2cella</p>
</td>
</tr>
</table>
Eredmény:
A kéka főtáblánk. Ezen belül is a táblákát, cellákat lehet helyezni. Ez a tábla Default azaz balra van igazítva a tábla benne pedig középre.( Center)
|
A kéka főtáblánk. Ezen belül is a táblákát, cellákat lehet helyezni. Ez a tábla Default azaz balra van igazítva a tábla benne pedig középre.( Center)
|
1sor/1cella |
1sor/1cella |
|
2sor/1cella |
2sor/2cella |
|
Egyszerű gombhatású navigáló tábla. Egy példáját itt is (a letölthető weblapoknál ) megnézheted.
Alapban van egy ötrészes táblánk. Ami jelen esetben 500x20 pixel. Ahoz, hogy ne keljen mindig a gif-et, vagy jpeg gombot cserélni feliratozni, úgy is megoldhatjuk, hogy csinálunk egy ilyen kis táblát, és az elkészített gombot háttérként alkalmazzuk a táblába felirat nélkül
500x20 tábla:
<table align="center" border="0" cellpadding="0" cellspacing="0" width="500" height="20" bgcolor="#6699FF">
<tr>
<td width="100" style="border-top-width:1px; border-right-width:0px; border-bottom-width:1px; border-left-width:1px; border-color:black; border-style:solid;">
<p align="center">Link1</p>
</td>
<td width="100" style="border-top-width:1px; border-right-width:0px; border-bottom-width:1px; border-left-width:1px; border-color:black; border-style:solid;">
<p align="center">Link2</p>
</td>
<td width="100" style="border-top-width:1px; border-right-width:0px; border-bottom-width:1px; border-left-width:1px; border-color:black; border-style:solid;">
<p align="center">Link3</p>
</td>
<td width="100" style="border-top-width:1px; border-right-width:0px; border-bottom-width:1px; border-left-width:1px; border-color:black; border-style:solid;">
<p align="center">Link4</p>
</td>
<td width="100" style="border-width:1px; border-color:black; border-style:solid;">
<p align="center">Link5</p>
</td>
</tr>
</table>
A táblák: ( Lehet hosszabb, vagy szélesebb is a tábla, vagy a celálk méretét is változtathatod. )
Ahoz, hogy ezt a táblát kajuk a giffel a háttérben, ahoz ezt a sort kell megváltoztatni :
Erről
<table align="center" border="0" cellpadding="0" cellspacing="0" width="500" height="20" bgcolor="#6699FF">
Erre
<table align="center" border="0" cellpadding="0" cellspacing="0" width="500" height="20" bgcolor="#6699FF" background="gomb1.gif">
Igaz, hogy így nem változik a gomb színe (onmouseover) csak a link, a felirat szine, de így egyszerű a feliratcsere egy gombon, és nem kell előtöltés a képeknek.
Így fognak kinézni háttérgiffel a táblák:
A gif pedig egy egyszerű photoshoppal készített kis gif, felirat nélkül. Ha háttérként tesszük be, tudjuk gyorsan könnyen cserélni a feliratot. Itt most csak azért félkövér a betű ha rámész az egérrel mert az oldal alapja.
Természetesen bármilyen alakú giffet tehetsz háttérként, teheted cellánként is, akár más és más giffet.
A szöveg szinének változtatását az egérrel való találkozáskor az alapokban megtalálod részletesen.
Alkalmazhatod a lenti gomsor szerint is (onmouseover) Ha egérrel rámész, akkor más gif töltődik be. Erről majd a képek beillesztése leckében lesz szó.
Gombháttereket találsz a letöltések menüpont alatt, vagy kattints ide.
2.Lecke
Táblázatok, cellák.?
3.Lecke
Szövegformázás.
Célszerű olyan betűtípust választanunk ami a legtöbb ember gépén telepítve van. Ha nem adunk mekhjkg. Ha nem adunk meg típust, akkor a látogató böngészőjének alapbeállításai szerint jelennek meg és az lehet, hogy nem ugyanaz mint ahogy a lapot tervezted. <FONT face="Arial, Verdana, Times New Roman, sans-serif"> Így megadhatod az alapot, de adhastz minden szövegtörzsnek betűtipust betűmértet.
<p><font size="3" face="Arial">ez Arial</font></p>
<p><font size="2" face="Verdana">ez Verdana</font></p>
<p><font size="3" face="Times New Roman">ez Times New Roman</font></p>
Eredmény:
ez Arial
ez Verdana
ez Times New Roman
Szövegdíszítés:
<b> félkövér lesz. ez Arial
<u> aláhúzott ez Arial
<i> dőlt ez Arial
<strike> középen áthúzott ez Arial
Tehát akkor a teljes sor így fog kinézni: <p><font size="3" face="Arial"><b>ez Arial</font></p>
Adhatunk meg heading azaz <h1>Ide a szöveg<h1> díszitést is.
<h1><font face="Times New Roman">ez Arial</font></h1>
Eredmény:
ez Arial
Színek.
<font color="red">Piros</font>
vagy
<font color="#FF0000">Piros</font>
Mind a kettő ugyanaz, csak az egyík # jellel kezdődik és a hat számmal végződik míg a másik az alapszínek szavait adja meg.
Szöveg hátterének szinezése:
<span style="background-color:red;">Most ez a piros</span>
Eredmény:
Most ez a piros
Szét is tolhatjuk:
<span style="letter-spacing:10px;">Toljuk szét</span>
Eredmény:
Toljuk szét
<span style="word-spacing:21; letter-spacing:0px;">Toljuk szét de csak a szóközt.</span>
Eredmény:
Toljuk szét de csak a szóközt.
Szöveg formázása:
Ahogy töbször leírtam a szöveget célszerű formázni, hogy mindig mindenkinek úgy jelenjen meg a veblapunk ahogy mi képzeltük el. Erre egy egyszerű kód amit a forrásba illeszthetünk:
<FONT face="Verdana, Arial, Tahoma, sans-serif" FONT size="2">
Formázás másképp: Css.
Egy öszetett de egyszerű példa a css hivatkozása:
<style>
<!--
A.type1:link {color:#000000; text-decoration:none;}
A.type1:visited {color:#000000; text-decoration:none;}
A.type1:active {color:#FFDD00; text-decoration:none;}
A.type1:hover {color:#990000; text-decoration:underline;}
A.type2:link {color:#6600FF; text-decoration:underline;}
A.type2:visited {color:#6600FF; text-decoration:underline;}
A.type2:active {color:#6600FF; text-decoration:underline;}
A.type2:hover {color:#000080; text-decoration:underline;}
A.type3:link {color:##FF9900; text-decoration:none;}
A.type3:visited {color:##FF9900; text-decoration:none;}
A.type3:active {color:#00CCFF; text-decoration:none;}
A.type3:hover {color:#FF8000; text-decoration:underline;}
A.type4:link {color:#FF5577; text-decoration:underline;}
A.type4:visited {color:#FF2234; text-decoration:underline;}
A.type4:active {color:#445566; text-decoration:underline;}
A.type4:hover {color:#334455; text-decoration:underline;}
//-->
</style>
<style> script above.
<font size="2">
</font>
</style>
<a class="type1" href="#">hivatkozás</a>
<a class="type2" href="#">hivatkozás</a>
<p><a class="type4" href="#">hivatkozás</a>
<p><a class="type3" href="#">hivatkozás</a>
Eredménye.( Megnézem )
A hivatkozásnál a megfelelő részre kell hivatkozni: <a class="type1" href="#">hivatkozás</a>
Ilyenkor az 1-essel jelölt rész szinei érvényesülnek !
Mi van olyankor ha nem megy a hivatkozás ha átírod a szöveget, nem fog változni a színe ha rámész egérrel ?
Ennek az az oka, hogy törlöd a szöveget a hivatkozásnál, akkor törlöd a hivatkozáshoz tartozó dolgokat is. pl: az én lapjaim esetében a hivatkozás így néz ki:
<a class="type1" href="elérési út">ide írod a hivatkozást.</a>
Ehez tartozik egy style rész is:
<style>
<!--
A.type1:link {color:#000000; text-decoration:none;}
A.type1:visited {color:#000000; text-decoration:none;}
A.type1:active {color:#FFDD00; text-decorati0on:none;}
A.type1:hover {color:#990000; text-decoration:underline;}
//-->
</style>
Tehát ha nem teszed ezt bele: <a class="type1", akkor nem fog érvényesülni a css.A teljes sor így fog kinézni:
<a class="type1" href="http://weboldaladcíme.hu">hivatkozás</a> Ha ez nagyon nem megy akkor egy nagyon egyszerű tipp, hogy megtartsd a hivatkozásoknak az eredeti css részeit (pl: ha rámész a szövegre, akkor elszineződik, vagy aláhúzott lesz) A legegyszerűbb ha fogod a szerkesztő programodat ( lehet notepad is ) és a hivatkozást úgy írod át, hogy nem törlöd. Ezt, hogy lehet ? Egyszerű. Van egy hivatkozásod, mondjuk: Fotóalbum. Akkor ezt ne töröld, hanem írj bele a közepébe, monjuk a Fotó-után írd be a te szövegedet legyen: Zenéim: Így fog kinézni:FotóZenéiamalbum. Ezek után töröld a Fotó részt és az album részt és a css megmaradt. Ezek után csak írd át az elérési utat, ahol a zenéid vannak :))
3.Lecke
Szövegformázás.
3.Lecke
Szövegformázás.
Célszerű olyan betűtípust választanunk ami a legtöbb ember gépén telepítve van. Ha nem adunk mekhjkg. Ha nem adunk meg típust, akkor a látogató böngészőjének alapbeállításai szerint jelennek meg és az lehet, hogy nem ugyanaz mint ahogy a lapot tervezted. <FONT face="Arial, Verdana, Times New Roman, sans-serif"> Így megadhatod az alapot, de adhastz minden szövegtörzsnek betűtipust betűmértet.
<p><font size="3" face="Arial">ez Arial</font></p>
<p><font size="2" face="Verdana">ez Verdana</font></p>
<p><font size="3" face="Times New Roman">ez Times New Roman</font></p>
Eredmény:
ez Arial
ez Verdana
ez Times New Roman
Szövegdíszítés:
<b> félkövér lesz. ez Arial
<u> aláhúzott ez Arial
<i> dőlt ez Arial
<strike> középen áthúzott ez Arial
Tehát akkor a teljes sor így fog kinézni: <p><font size="3" face="Arial"><b>ez Arial</font></p>
Adhatunk meg heading azaz <h1>Ide a szöveg<h1> díszitést is.
<h1><font face="Times New Roman">ez Arial</font></h1>
Eredmény:
ez Arial
Színek.
<font color="red">Piros</font>
vagy
<font color="#FF0000">Piros</font>
Mind a kettő ugyanaz, csak az egyík # jellel kezdődik és a hat számmal végződik míg a másik az alapszínek szavait adja meg.
Szöveg hátterének szinezése:
<span style="background-color:red;">Most ez a piros</span>
Eredmény:
Most ez a piros
Szét is tolhatjuk:
<span style="letter-spacing:10px;">Toljuk szét</span>
Eredmény:
Toljuk szét
<span style="word-spacing:21; letter-spacing:0px;">Toljuk szét de csak a szóközt.</span>
Eredmény:
Toljuk szét de csak a szóközt.
Szöveg formázása:
Ahogy töbször leírtam a szöveget célszerű formázni, hogy mindig mindenkinek úgy jelenjen meg a veblapunk ahogy mi képzeltük el. Erre egy egyszerű kód amit a forrásba illeszthetünk:
<FONT face="Verdana, Arial, Tahoma, sans-serif" FONT size="2">
Formázás másképp: Css.
Egy öszetett de egyszerű példa a css hivatkozása:
<style>
<!--
A.type1:link {color:#000000; text-decoration:none;}
A.type1:visited {color:#000000; text-decoration:none;}
A.type1:active {color:#FFDD00; text-decoration:none;}
A.type1:hover {color:#990000; text-decoration:underline;}
A.type2:link {color:#6600FF; text-decoration:underline;}
A.type2:visited {color:#6600FF; text-decoration:underline;}
A.type2:active {color:#6600FF; text-decoration:underline;}
A.type2:hover {color:#000080; text-decoration:underline;}
A.type3:link {color:##FF9900; text-decoration:none;}
A.type3:visited {color:##FF9900; text-decoration:none;}
A.type3:active {color:#00CCFF; text-decoration:none;}
A.type3:hover {color:#FF8000; text-decoration:underline;}
A.type4:link {color:#FF5577; text-decoration:underline;}
A.type4:visited {color:#FF2234; text-decoration:underline;}
A.type4:active {color:#445566; text-decoration:underline;}
A.type4:hover {color:#334455; text-decoration:underline;}
//-->
</style>
<style> script above.
<font size="2">
</font>
</style>
<a class="type1" href="#">hivatkozás</a>
<a class="type2" href="#">hivatkozás</a>
<p><a class="type4" href="#">hivatkozás</a>
<p><a class="type3" href="#">hivatkozás</a>
Eredménye.( Megnézem )
A hivatkozásnál a megfelelő részre kell hivatkozni: <a class="type1" href="#">hivatkozás</a>
Ilyenkor az 1-essel jelölt rész szinei érvényesülnek !
Mi van olyankor ha nem megy a hivatkozás ha átírod a szöveget, nem fog változni a színe ha rámész egérrel ?
Ennek az az oka, hogy törlöd a szöveget a hivatkozásnál, akkor törlöd a hivatkozáshoz tartozó dolgokat is. pl: az én lapjaim esetében a hivatkozás így néz ki:
<a class="type1" href="elérési út">ide írod a hivatkozást.</a>
Ehez tartozik egy style rész is:
<style>
<!--
A.type1:link {color:#000000; text-decoration:none;}
A.type1:visited {color:#000000; text-decoration:none;}
A.type1:active {color:#FFDD00; text-decorati0on:none;}
A.type1:hover {color:#990000; text-decoration:underline;}
//-->
</style>
Tehát ha nem teszed ezt bele: <a class="type1", akkor nem fog érvényesülni a css.A teljes sor így fog kinézni:
<a class="type1" href="http://weboldaladcíme.hu">hivatkozás</a> Ha ez nagyon nem megy akkor egy nagyon egyszerű tipp, hogy megtartsd a hivatkozásoknak az eredeti css részeit (pl: ha rámész a szövegre, akkor elszineződik, vagy aláhúzott lesz) A legegyszerűbb ha fogod a szerkesztő programodat ( lehet notepad is ) és a hivatkozást úgy írod át, hogy nem törlöd. Ezt, hogy lehet ? Egyszerű. Van egy hivatkozásod, mondjuk: Fotóalbum. Akkor ezt ne töröld, hanem írj bele a közepébe, monjuk a Fotó-után írd be a te szövegedet legyen: Zenéim: Így fog kinézni:FotóZenéiamalbum. Ezek után töröld a Fotó részt és az album részt és a css megmaradt. Ezek után csak írd át az elérési utat, ahol a zenéid vannak :))
3.Lecke
Szövegformázás.
4.Lecke
Képek beillesztése, méretezése.
Nagyon sok weblap használ képeket. Céljuk többféle is lehet. De a lényeg, az esztétikus elhelyezés. Célszerű a képeket is táblákba(cellákba) helyezni így más képernyőfelbontásnál sem csúszik szét a képünk.
A beillesztendő kódok pirossal vannak kiemelve !
Ez itt egy sima kép, keret nélkül.
Kép beillsztése: <img src="minta.jpg" width="120" height="100">
widht="120" - szélesség, height="100" magasság, vagy hosszúság.
Alt szöveg megadása: Ha az egeret a kép fölé viszed, ez a szöveg fog megjelenni:
<img src="minta.jpg" width="120" height="100" border="0" alt="Ide a szövegeedet írjad ami megjelenik ha az egeret a képre viszed.">
A minta.jpg a kép neve. Ezt kell átírni a te képed nevére.
Vagy adhatsz neki egyszeű keretet. <img src="minta.jpg" width="120" height="100" border="1">
border="1"- keretet adhatsz meg neki.
Vagy egy bonyolultabb keretet.
<img src="minta.jpg" width="120" height="100" style="border-width:1px; border-color:black; border-style:solid;">
Vagy adhatjuk meg így is: Minden oldalnak külön megadhatjuk a keretvastagságot.. Ilyenkor ha 0-van valamelyik érték azon az oldalon nem lsz keret.
<img src="minta.jpg" width="120" height="100" border="0" style="border-top-width:1px; border-right-width:1px; border-bottom-width:1px; border-left-width:1px; border-color:black; border-style:solid;">
Itt a képen el van túlozva 5px van megadva, hogy látszodjon. Láthatod baloldalt és alul a keret vastagabb.
A keretek lehetnek: none:(nincs), dotted:(pontok), dashed(vonal), solid: (folyamatos vonal), double: (dupla). VAgy lehet még: groove, ridge, inset, outset.
Megadhatjuk, hogy minden oldalnak más témájú kerete legyen.
<img src="minta.jpg" width="120" height="100" border="0" style="border-width:1px; border-color:black; border-top-style:dotted; border-right-style:double; border-bottom-style:dashed; border-left-style:solid;">
Itt minden oldalanak külön külön lehet adni keretvastagságot, vagy stílust.
Adhatunk neki külön keretet külön színt minden oldalnak: <img src="minta.jpg" align="left" width="120" height="100" border="0" style="border-width:1px; border-top-color:blue; border-right-color:red; border-bottom-color:white; border-left-color:black; border-top-style:dotted; border-right-style:double; border-bottom-style:dashed; border-left-style:solid;">
Hivatkozások. Adhatunk meg a képeknek hivatkozást. Ez arra jó, ha rákattintunk, akkor bejön egy oldal, vagy a kép teljes méretben.
Tehát a kép beillesztése: <img src="minta.jpg" width="120" height="100">
Ha ráklikkelünk kijön egy új ablakban a teljes kép:
<a href="minta.jpg" target="_blank"><img src="minta.jpg" width="120" height="100">
Ha nem akarod, hogy külön ablakban nyiljon meg, akkor hagyd el a target="blank" részt, vagy ki is javíthatod self-re.
<a href="minta.jpg"><img src="minta.jpg" width="120" height="100">
Táblázatba való beszúrás/fotóalbum.
Készítsünk egy táblázatot
|
|
|
|
|
|
|
Kép neve |
Kép neve |
Kép neve |
Kép neve |
Kép neve |
|
|
|
|
|
|
|
Kép neve |
Kép neve |
Kép neve |
Kép neve |
Kép neve |
AJÁNLOM AZ OLDALT
