Az előadás letöltése folymat van. Kérjük, várjon

Az előadás letöltése folymat van. Kérjük, várjon

Egyszerű WEb-oldal készítés WYSIWYG („What You See Is What You Get”, azaz az „amit látsz, azt kapod”) szerkesztő segítségével. A Mozilla 1.7.11 magyar.

Hasonló előadás


Az előadások a következő témára: "Egyszerű WEb-oldal készítés WYSIWYG („What You See Is What You Get”, azaz az „amit látsz, azt kapod”) szerkesztő segítségével. A Mozilla 1.7.11 magyar."— Előadás másolata:

1 Egyszerű WEb-oldal készítés WYSIWYG („What You See Is What You Get”, azaz az „amit látsz, azt kapod”) szerkesztő segítségével. A Mozilla magyar nyelvű szerkesztőjének használata Letölthető:

2 Mozilla szerkesztője Előnyök: Magyar nyelvű Ingyenesen letölhető Azonnal megtekinthető Szükség esetén a forrásba HTML parancsokkal kiegészíthető

3 Szerkesztés-formázás a szövegszerkesztésnél megtanultak szerint: Szöveg beírása Szerkesztendő szöveg kijelölése Megfelelő formázási lehetőségek kiválasztása menüből, vagy eszközök segítségével

4 HTM forrás, megtekintése - szerkeszthető Ismerős HTML tag-ek felfedezhetőek Vannak újdonságok, amit a „szerkesztő ír be” (később)

5 Mentés: Fontos oldalunkat megfelelő néven és helyre rögtön az elején mentsük el, aztán folyamatosan mentsünk 1.Fájl  mentés másként 2.Az első mentés alkalmával, ha még addig nem tettük be kell írnunk az aktuális oldal címét (TITLE) (ezt utólag módosíthatjuk 3.Ezután a már megszokott módon menthetünk (pontosan állítsuk be a file helyét és nevét

6 Böngésző színeinek beállítása: szöveg, hivatkozások színei

7 Háttér beállítása: Ne feledjük: 1. A háttér file nevében ne legyen ékezet 2. A háttér kép és a Html egy mappában legyen (ellenkező esetben útvonalat kell adni)

8 Háttérkép hiba lehetőségek: 1.Túl kicsi a kép amit háttérnek szeretnénk tenni, ekkor többször beteszi (amennyi fér - képernyőfelbontástól függ) 2. Túl sötét, túl sok minden van a háttéren  nem jól olvasható a szöveg

9 A mozilla „nem hajtja végre” a formázási műveletet Szúrjunk be egy vonalat: beszúrás  vízszintes vonal  (a vonalat az aktuális pont után teszi) Ha a vonal tulajdonságait szeretnénk megváltoztatni, pl 10 pontos, az oldal közepén 80 %-a az asztalnak és középre igazított Rákattintunk kettőt a vonalra  ablak nyílik Beállítjuk a kívánt formázást, de nem történik változás

10 Beágyazott stílus törlése 1.Haladó szerkesztés 2. Beágyazott stílusból eltöröljük a beállításokat 3. Ok és most már beállíthatjuk a megfelelő tulajdonságokat, végre- hajtja

11 Táblázat Táblázat  beszúrás  táblázat Létrehozáskor, beállíthatjuk a táblázat tulajdonságait

12 Táblázat tulajdonságainak módosítása Táblázatban jobb klikk  táblázatcella tulajdonságai Értelemszerűen állítható a táblázat és cellák tulajdonságai Ha nem sikerül a formázás, töröljük a beágyazott stílust (haladó szerkesztés)

13 Táblázat tulajdonságainak módosítása A táblázat további módosítása hasonló a szövegszerkesztésnél tanultakkal: pl Cellák egyesítése: megfelelő cellák kijelöl  jobb klikk  kijelölt cellák egyesítése (vagy felosztása) Táblázatba új sor, oszlop beszúrása: megfelelő helyre kattint  táblázat  beszúrás  sor alulra felülre…. Táblázat, sor oszlop törlése  hasonló Táblázat hátterének beállítása hasonló Táblázatba írni, képet beszúrni….

14 Feladat : Egyesítsük a táblázatunk első sorának két celláját A második sor második cellájába írjuk be a következőket A második sor első cellájába szúrjunk be egy képet: oroszlan.jpg: MCellába áll –> beszúrás  kép, vagy Kép eszköz Tallózás, magyarázó szöveg, vagy ne használjon Már tudod: A háttér file nevében ne legyen ékezet 2. A háttér kép és a Html egy mappában legyen

15 Felsorolás számozás Tanultak alapján : szöveg kijelöl  felsorolás, vagy számozás

16 Többszintű felsorolás Mint a szövegszerkesztésn él itt is van lehetőség többszintű felsorolásra Végezd el a feladatot (segít: behúzás növelése, csökkentése)

17 Hivatkozás: Feladat: 1.Nyiss egy üres oldalt, címe(TITLE) legyen :X.Y második oldala 2.Mentsd el html2.html néven 3.Szúrd be lo.jpg-t és alá a vissza.gif-et 4.A vissza képre szeretnénk egy hivatkozást beszúrni ami visszaugrik a html1.html oldalra 5.kép kijelöl: beszúrás  hivatkozás, vagy Hivatkozás eszköz 6.Tallózás, html1.html (Hol van a vissza.gif ???)

18 Feladat A HTML1.html oldalon a LÓ szóra ugorjon át a html2.html oldalra Próbáld ki a hivatkozásokat

19 Külső hivatkozás: Ha az interneten található oldalra szeretnénk hivatkozást betenni, a pont elérhetőséget meg kell adni Feladat: A HTML.1 oldalon a macska szóra tegyél be hivatkozást a : oldalra Ugyanitt az Emma nénire tegyél egy linket ami levelet küld a Hivatkozás címe: Próbáld ki a hivatkozásokat

20 HTML oldal forrása : Nézd meg mindkét HTML forrását Keress benne ismerős utasításokat


Letölteni ppt "Egyszerű WEb-oldal készítés WYSIWYG („What You See Is What You Get”, azaz az „amit látsz, azt kapod”) szerkesztő segítségével. A Mozilla 1.7.11 magyar."

Hasonló előadás


Google Hirdetések