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



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

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

mhtml:file://d:\vizsga\html\hogyan szerkeszteni weboldalt - HTML alapok.mht

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

forrás: Web és PHP leckék

Mester Gyula 2003 Internet

HTML alapok. A HTML az Internetes oldalak nyelve.

Webprogramozás HTML alapok előadás

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

HTML, CSS. Morabito Érdi SzC Eötvös József Szakképző Iskolája

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

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

Képnézeget. Gépigény: Bármilyen számítógépen m ködik, amin található böngész és Internet elérés.

9. MODUL WEBKEZDŐ. A vizsgafeladat megoldásához kizárólag a választott webkészítő program, illetve jegyzettömb (editor) használható.

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

Információ Európa országairól (összetett alkalmazás)

Képek a HTML oldalon

HTML ÉS PHP AZ ALAPOKTÓL

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

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

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

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

Szövegszerkesztő programok: Jegyzettömb, WordPad, Microsoft Word

HTML sablon tervezése

HTML ÉS PHP ŐSZI FÉLÉV

NeoCMS tartalommenedzselő szoftver leírása

Tamás Ferenc: CSS táblázatok 2.

Részvételi regisztráció támogatása a tanfolyamszervező saját weboldalán

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

Szövegszerkesztés Verzió: 0.051

Kő, Papír, Olló. Felhasználói dokumentáció

Multimédia 2017/2018 II.

Az evangélikus honlapszerkesztő rendszer használata

MUNKAANYAG. Angyal Krisztián. Szövegszerkesztés. A követelménymodul megnevezése: Korszerű munkaszervezés

Webprogramozás szakkör

Informatikai tevékenység 2234 Maglód, Széchenyi u Mérnöki, tanácsadói tevékenység Iroda: Mobil: Telefon:

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

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

Felsô menü: Jogszabály- és dokumentumtár menüpont. Almenüpontok:

11. Balra zárt igazítás A bekezdés sorai a bal oldali margóhoz igazodnak. 12. Beillesztés

Novell GroupWise levelező rendszer alapok Kiadványunk célja, hogy a Nemzeti Közszolgálati Egyetemen használt Novell GroupWise (a továbbiakban GW)

HTML, XML szerkesztés

Szövegszerkesztés Microsoft Word XP. Megoldások

A HTML nyelv alapjai

Infokommunikáció (PF10IK511L) kérdései

Kiegészítő melléklet (elektronikus beszámoló)

Tili-Toli játék. Felhasználói dokumentáció

HTML alapok. HTML = HyperText Markup Language

2. A HTML NYELV ALAPJAI

WEBSZERKESZTÉS ELMÉLETI VIZSGAKÉRDÉSEK

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

HTML parancsok (html tanfolyam témakörei)

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

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

INFORMATIKA KÖZÉPSZINTŰ GYAKORLATI VIZSGA 2009.

Prezentáció használata

Annak ellenére, hogy a számítógépes szövegszerkesztés az utóbbi 10 évben általánossá vált, az irodai papírfelhasználás

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

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

Gábor Dénes Számítástechnikai Emlékverseny 2012/2013. Döntő. Alkalmazói kategória III. korcsoport

edia 2.3 Online mérési platform feladatfelviteli kézikönyv Diagnosztikus mérések fejlesztése Molnár Gyöngyvér Papp Zoltán Makay Géza Ancsin Gábor

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

HTML. Dr. Nyéki Lajos 2016

Szövegszerkesztés Word XP-vel. Feladatgyűjtemény

Felhasználói kézikönyv a minősítési értékelő modul használatához

XML-HMTL Beadandó Dolgozat. Avagy, mit sikerült validálnunk fél év alatt

3. ALKALOM. Felsorolás Helyesírás ellenırzés Váltás kis és nagybető között Táblázat Ablak felosztása Formátummásoló FELSOROLÁS ÉS SZÁMOZÁS

UniPoll Feedback. Intézményi integrált kérdőívkészítő rendszer vélemény és visszajelzés gyűjtéshez.

AXEL Számlázó és készletnyilvántartó program

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

DOBOZOK. A doboz négy részből áll: 1. Margó (margin) 2. Szegély (border) 3. Kitöltés (padding) 4. Tartalom (content)

NETFIT modul Tanári felület Felhasználói útmutató. Magyar Diáksport Szövetség

Pályamunka feltöltése és nevezés a XXXIII. Országos Tudományos Diákköri Konferenciára

A DBM függvények használata

1. ábra Mester oldal alapján különböző témákkal létrehozott webhely oldalai

edia 2.2 Kézikönyv feladatfelvitelhez Diagnosztikus mérések fejlesztése Készítette: Molnár Gyöngyvér Papp Zoltán Makay Géza Ancsin Gábor

VÁTI Kht. Dokumentációs Központ Felhasználói segédlet elektronikus dokumentum küldéséhez

Ed. Version 1.2. Az XML nyelv. Az XML nyelv. Győri László munkája. Ed. Version 1.2

BlackBerry Bold Billentyûzár Lezárja a készüléket / billentyûzetet. Némító billentyû Egy média állomány lejátszása / leállítása Hívás némítása

MUNKAANYAG. Földy Erika. A szakmai önéletrajztól a művészeti kritikáig (Az. alkotói tevékenység komplex megjelenítése,

BEVEZETÉS A HTML NYELV HASZNÁLATÁBA

Gazdasági informatika

Információ és kommunikáció

E-Fedezetkezelő. felhasználói kézikönyv. Fővállalkozói adminisztrátorok számára

A html nyelv elemi. Megnevezés Leírás Példa/Magyarázat

INFORMATIKA JAVÍTÁSI-ÉRTÉKELÉSI ÚTMUTATÓ

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

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

7. Előadás. Makrók alkalmazása. Salamon Júlia. Előadás I. éves mérnök hallgatók számára

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

A 2014/2015 tanévi Országos Középiskolai Tanulmányi Verseny döntő fordulójának feladatai. I. (alkalmazói) kategória

2011 Rose Software Kft. Minden jog fenntartva!

ÉRTÉKELÉS: VIZSGÁZTATÓ ALÁÍRÁSA:... VIZSGÁZÓ NEVE:

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

INFORMATIKA. PRÓBAÉRETTSÉGI május KÖZÉPSZINT. Pontozási és javítási útmutató

FELHASZNÁLÓI KÉZIKÖNYV ÜGYFELEK SZÁMÁRA

MÁOK Sm. Szervezete 7400 Kaposvár, Cseri major Utolsó frissítés: TÁVOKTATÁS. MS Excel táblába oszlop beszúrása

Planet Me blog aggregátor létrehozása

INFO1 WEB, HTML, CSS

Az Állami Autópálya Kezelő Zrt. Általános Szerződési Feltételei e-matricát értékesítő viszonteladók részére. 4. számú melléklet

Átírás:

ÁLTALÁNOS WEBLAPSZERKESZTÉSI TUDNIVALÓK HTML dokumentum = weblap = weboldal = webpage Egy HTML dokumentum kiterjesztései: HTM vagy HTML STÍLUSLAP = Egy vagy több HTML utasítás, értékekkel ellátott paramétereinek összességét tartalmazó állomány. Kiterjesztése: CSS LINK = HIVATKOZÁS = olyan weboldalon megjelenő elem (pl. szó, mondat, kép, alakzat) amelyre kattintva egy másik helyi vagy távoli weboldalra vagy képre mutat. FORM = a weboldal egészén vagy egy részén megjelenő olyan nem látható keret, melyen belül a felhasználó által beállítható és/vagy kitölthető vezérlőelemek rendezett összessége található. FRAME = Weboldal egészén vagy egy részén elhelyezkedő olyan terület mely ugyanazon vagy egy másik helyi vagy távoli weboldal tartalmát képes megjeleníteni. ÁLTALÁNOS HTML KÓDOLÁSI TUDNIVALÓK Ahol szükséges, kötelező a záró utasítást használni. Az alapértelmezett betűméret értéke 3. Paraméter csak nyitó HMTL utasításon belül adható meg. A paraméterek megadása történhet jelek között, vagy nélküle. Több nyitó HTML utasítás beágyazása esetén, amit utoljára megnyitottunk, azt zárjuk be.

A WEBOLDAL (SZABVÁNYOS HTML DOKUMENTUM) ÁLTALÁNOS SZERKEZETE <HTML> <HEAD> HTML DOKUMENTUM KEZDETE FEJRÉSZ KEZDETE <TITLE> Dokumentum címe </TITLE> </HEAD> <BODY> FEJRÉSZ VÉGE DOKUMENTUM TÖRZS KEZDETE Ide kerül a dokumentum tartalma. (szöveg/képek stb.) </BODY> </HTML> DOKUMENTUM TÖRZS VÉGE HTML DOKUMENTUM VÉGE

Utasítás neve Paramétere(i) Paraméter(ek) jelentése Utasítás jelentése <BODY> </BODY> background bgcolor text link style background= háttérkép beszúrása fájlból/hálózatról (pl. kep.jpg) bgcolor= háttérszín megadása (pl. blue vagy #CC66EA) text= egész weblapra kiterjedő betűszín megadása (pl. blue vagy #CC66EA) link= a weblapon megjelenő hivatkozások színének megadása (pl. blue vagy #CC66EA) style= stílus paraméterek megadása <TITLE> </TITLE> ----- ----- <H1> </H1> <H2> </H2> <H3> </H3> <H4> </H4> <H5> </H5> <H6> </H6> align align= a címsor elhelyezése/igazítása a weboldalon. Lehetséges értékei: Left (balra igazítás) Center (középre igazítás) Right (jobbra igazítás) Justify (sorkizárt) <BR> ----- ----- A HTML dokumentum testrészét/törzsét határoló E utasításpár közé gépelt karakterek, szavak, mondatok (kivéve más HTML utasítások és speciális karakterek) megjelennek a weboldalon. A HTML dokumentum címének megadására szolgáló utasításpár, amelyet a <HEAD> </HEAD> elemek közé kell elhelyezni. A cím, a böngésző címsorában jelenik meg. Címsor stílus megadására szolgáló Összesen 6 szintű címsor képezhető, ahol a szinteket az utasításon belül jelezzük. Ahogy nő a szint, úgy csökken a betűméret. Az ENTER billentyűt jelentő/helyettesítő utasítás. ----- ----- Szóköz speciális karakter.

<FONT> </FONT> color size face color= betűszín megadása (pl. blue vagy #CC66EA) size= betűméret megadása (pl. 6 vagy +3 vagy -1) face= betűtípus megadása (pl. Arial vagy Courier New) <B> </B> ----- ----- <I> </I> ----- ----- <U> </U> ----- ----- <S> </S> ----- ----- <SUB> </SUB> ----- ----- <SUP> </SUP> ----- ----- <P> </P> align align= a bekezdés elhelyezése/igazítása a weboldalon. Lehetséges értékei: Left (balra igazítás) Center (középre igazítás) Right (jobbra igazítás) Justify (sorkizárt) Karakterek színének, típusának, méretének beállítására szolgáló nyitó A karakterek méretezése során csak egész szám adható meg. A méret megadás során használható értéktartomány - 7 és +7 között lehetséges. Félkövér betűstílus formázására szolgáló Dőlt betűstílus formázására szolgáló Aláhúzásra szolgáló Áthúzásra szolgáló Alsó index képzésére szolgáló Felső index képzésére szolgáló Bekezdés előállítására szolgáló A záró elem megadása nem kötelező. Egy újabb <P> nyitóelem nagyobb térközzel jár.

<HR> </HR> <A> </A> color align size width noshade href color= vonal színének megadása (pl. blue vagy #CC66EA) align= a vonal igazítására szolgál. Lehetséges értékei: Left (balra igazítás) Center (középre igazítás) Right (jobbra igazítás) size= vonal vastagságának megadása (pl. 5) width= vonal szélességének megadása (pl. 100 vagy 25%) noshade= vonal árnyékának megszüntetése href= a hivatkozott weboldal, kép, e-mail cím megadása. Néhány példa: http://www.sg.hu (távoli URL cím) tavasz.html (helyi weboldal) D:/kepek/zivatar.gif (helyi kép) http://www.kep.hu/tavasz.gif (távoli kép) mailto://ecdl@vizsga.hu (e-mail) Vízszintes vonal készítésére szolgáló A méret megadása csak egész számokkal történhet. Az érték képpontban értendő. A vonal szélessége megadható képpontként értelmezett egész szám formájában vagy % érték formájában. % érték formában megadott vonalszélesség érték, a képernyő felbontásához (annak is a szélességértékéhez) való viszonyítást jelenti. Helyi/távoli weboldalra, képre, e-mail címre történő hivatkozás készítését megvalósító A protokoll (http vagy mailto vagy ftp) megadása részben kötelező. Az utasításpár közé írt karakterek a böngészőben aláhúzva és más színnel fog megjelenni. Hivatkozás megadható képre is, amelyet az <A> utasításon belül kell elhelyezni.

<IMG> src align border width height vspace hspace src= a beszúrandó kép elérési útvonalának megadása. (pl. porcelan.jpg) align= a vonal igazítására szolgál. Lehetséges értékei: Bottom (alul) Left (balra igazítás) Middle (középre igazítás) Right (jobbra igazítás) Top (jobbra igazítás) border= kép keretének vastagsága pixelben. (pl. 5) width= kép szélességének megadása (pl. 640 vagy 25%) height= kép magasságának megadása (pl. 480 vagy 25%) vspace= vízszintes térköz megadása képpontban (pl. 100) hspace= függőleges térköz megadása képpontban (pl. 100) Kép, weboldalra történő beszúrására szolgáló utasítás. Ha a kép ugyanabban a könyvtárban van ahol az aktuális weboldal, akkor a paraméterben elegendő a képállomány nevét megadni. pl. bagoly.jpg Amennyiben width paraméter értékét % formájában adjuk meg, akkor azt határozza meg, hogy a kép szélessége a képernyő felbontásának hány %-át tegye ki. Ha a felbontás 1024*768 és a kép szélessége 25%, akkor a kép szélessége 1024*0,25=256 képpont lesz. Amennyiben height paraméter értékét % formájában adjuk meg, akkor azt határozza meg, hogy a kép magassága a képernyő felbontásának hány %-át tegye ki. Ha a felbontás 1024*768 és a kép magassága 50%, akkor a kép magassága 768*0,5=384 képpont lesz.

<UL> </UL> <LI> </LI> type type= a felsorolás szimbólumának meghatározása. Lehetséges értékek: Circle (üres kör) [ ] Disc (telített kör) [ ] Square (üres négyzet) [ ] A vspace paraméter azt határozza meg, hogy a kép bal és jobb oldalán hány képpontnyi üres hely legyen. A vspace paraméter azt határozza meg, hogy a kép felső és alsó részén hány képpontnyi üres hely legyen. Az <UL> nem sorszámozott egy-vagy többszintű lista készítésére szolgáló A <LI> listaelemek megadására szolgáló A type paraméter egyaránt megadható az <UL> és <LI> utasításban is. Amennyiben a type paraméter az <UL> utasításon belül szerepel, akkor a megadott szimbólum az összes olyan listaelemre érvényes, amelyhez nem tartozik más értékkel ellátott type paraméter. Ha nem adunk meg type paramétert, akkor sorszámozott lista jön létre.

<OL> </OL> <LI> </LI> <TABLE> </TABLE> <TR> </TR> <TD> <TD> type start border align width height cellpadding cellspacing colspan rowspan bgcolor bordercolor background type= a felsorolás szimbólumának meghatározása. Lehetséges értékek: 1 (arabszámozás) i (kis római számozás) I (nagy római számozás) a (angol ABC kis betűi szerinti számozás) A (angol ABC nagy betűi szerinti számozás) start= Sorszámozás kezdeti értékének megadása border= Tábla szegélyének megadása képpontban (pl. 2) align= a tábla/cella igazítására szolgál. Lehetséges értékei: Left (balra igazítás) Center (középre igazítás) Right (jobbra igazítás) Justify (sorkizárt) width= Tábla/cella szélességének megadása (pl. 640 vagy 25%) height= kép/cella magasságának megadása (pl. 480 vagy 25%) cellpadding= a cella tartalma és kerete közötti távolságot adja meg. (pl. 480 vagy 25%) Az <OL> sorszámozott egyvagy többszintű lista készítésére szolgáló A start paraméter nemcsak <OL> hanem tetszőleges <LI> elem paramétereként is megadható. Amennyiben a start paramétert a <LI> elem paramétereként adjuk meg, akkor a paraméter értéktől kezdve, a számozás újra kezdődik. A <TABLE> tábla létrehozására szolgáló A <TR> a tábla sorainak létrehozására szolgáló Ahány <TR> annyi sora van a táblának. A <TD> a tábla oszlopainak megadására szolgáló Ahány <TD> annyi oszlopa van a táblának. Mindegyik utasítás esetében ki kell tenni azok záró elemét is.

cellspacing= cella kerete és a tábla kerete közötti távolságot adja meg. (pl. 480 vagy 25%) colspan= Megadja, hogy egy cella, hány cella széles legyen. (Vízszintes cellaegyesítés) (pl. 2) rowspan= Megadja, hogy egy cella, hány cella magas legyen. (Függőleges cellaegyesítés) (pl. 2) bgcolor= háttérszín megadása (pl. blue vagy #CC66EA) bordercolor= szegényszín megadása (pl. blue vagy #CC66EA) background= háttérkép beszúrása fájlból/hálózatról (pl. kep.jpg) 1 sorból és oszlopból álló táblázat HTML kódja: <TABLE> <TR> <TD> </TD> </TR> </TABLE> Minden létrehozott tábla alapértelmezetten szegély nélkül jelenik meg balra igazítva. A <TD> helyett használatos <TH> utasítás olyan sort definiál, amely a táblázat fejlécsorát jelenti. Az align megadható <TD> elem paramétereként is. Ez esetben az adott cella tartalmát igazítja. A cellpadding és cellspacing paraméter csak a <TABLE> utasítás paramétereként adható meg. A colspan és rowspan paraméter <TD> elemek paramétereként adható meg.

MICROSOFT SHAREPOINT 2007 ALAPISMERETEK MUNKATERÜLET

=ESZKÖZTÁR a weboldal létrehozásához/megnyitásához/mentéséhez, általános szövegformázáshoz, teszteléshez, képek beszúrásához, hivatkozás előállításához és címsor kiválasztásához. =PARAMÉTER-ESZKÖZTÁR, a kijelölt HTML utasítások paraméterinek megadásához, valamint CSS stíluslapok elemeihez tartozó paraméterek beállításához. =STÍLUSLAP-KEZELŐ ESZKÖZTÁR, stíluslap készítésére, weblaphoz történő csatolására, vezérlésére. =ESZKÖZKÉSZLET, néhány HTML elem, űrlapelemek, vezérlőelemek, ASP.NET elemek beszúrásához. =SZERKESZTŐ MÓDOK =KIJELÖLT TERÜLET HTML UTASÍTÁSA(I) ÁLTALÁNOS SHAREPOINT 2007 KEZELÉSI TUDNIVALÓK Leggyakrabban TERVEZŐ módban készítjük a weblapot, de használhatjuk a KÓD szerkesztő módot is. A kész dokumentumot általában HTM (Weblapok) formátumban mentjük. Az ESZKÖZKÉSZLET elemeit Fogd és vidd módszerrel húzzuk az oldal megfelelő területére. A munkaterület felső peremén található narancsszínű fül/fülek az aktuálisan kijelölt weboldal területét határoló HTML utasítást/utasításokat mutatja. Tulajdonságaik a kijelölt HTML utasításra tröténő jogg egér gombbal érhetőek el. A HTML kódolás során használt HTML utasítások paramétereit, a munkaterületen az adott HTML utasítás kijelölését követően a PARAMÉTER-ESZKÖZTÁRON állíthatjuk be. Stílus alkalmazásával is beállíthatóak paraméterek.