HTML. Dr. Nyéki Lajos 2016

Méret: px

Mutatás kezdődik a ... oldaltól:

Download "HTML. Dr. Nyéki Lajos 2016"

Sarolta Borbélyné
7 évvel ezelőtt
Látták:

1 HTML Dr. Nyéki Lajos 2016

2 HTML és SGML HTML (Hypertext Markup Language) SGML (Standard Generalized Markup Language) ISO 8879:1986 A HTML nyelven készült dokumentumok kiterjesztése - az Internet szerveren:.html; - a helyi számítógépen:.htm.

3 A HTML nyelv fejlődése HTML Level 1 linkek, kép, hang, mozgókép kezelése HTML Level 2 az interaktív kérdőív (form) beépítése HTML Level 3 táblázat, matematikai képlet, ékezetes betű HTML Level 4 nagyméretű táblázat fokozatos megjelenítése, rugalmasabb űrlapkezelés, kibővült ékezetes karakterkészlet, CSS

4 HTML szabványok HTML , Tim Berners-Lee ötlete HTML november HTML 3.0 abbahagyva HTML január, W3 Consortium HTML április XHTML január HTML vége

5 A HTML dokumentum szerkezete A HTML nyelv elemei a tag-ek. A dokumentumok a <html> </html> tag-ek között helyezkednek el. A fejrész a <head> </head> tag-ek között található. Itt adjuk meg a dokumentum címét. A szövegtörzs a <body> </body> tag-ek között van. A kommentárok a  tag-ek között helyezkednek el.

6 Hello World! <!DOCTYPE html> <html> <head> <title> Hello World document </title> </head> <body> <h1> Hello, World! </h1> This is a minimal "hello world" HTML document. </body> </html>

7 Az eredmény

8 Címek Minden HTML dokumentumnak van címe. A böngésző a címet a címsorában jeleníti meg. A kereső programok a cím alapján találják meg az oldalt. A dokumentum címének megadása a fejrészben a <title> </title> tag-ekkel történik.

9 Fejlécek A HTML-ben hatszintű bekezdés fejlécet használhatunk <h1> és <h6> között. A fejléc (heading) megadása a <hn> </hn> tag-ekkel történik. Fejlécek csak bekezdések között fordulhatnak elő, bekezdésen belül nem. A fejlécek mindig magukban foglalnak soremelést is.

10 Bekezdések A bekezdések soremeléssel vannak elválasztva. A bekezdés (paragraph) megadása a tag-ekkel történik. Ezek hatására soremelés következik be.

11 Kapcsolatok A hypertext link megadja a kapcsolódó fájl vagy dokumentum helyét az Interneten. Két része van: - az anchor (horgony), megadása: <a > </a>; - az URL (Uniform Resource Locator). A link mutathat: - ugyanazon dokumentumon belülre; - másik dokumentumra; - másik dokumentum adott helyére.

12 A link megadása A link megadása: <a href = url > </a> Az URL megadása: mode : // host.domain [:port] / path / filename A mode például lehet: - file: egy fájl a helyi rendszeren ; - ftp: egy fájl egy FTP szerveren; - http: egy fájl egy W3 szerveren; - mailto: levélküldési lehetőség megadott címre.

13 Képek beillesztése A kép lehet külső (tehát egész oldalt betöltő) és belső. A külső képek szokásos formátuma.jpg vagy.png. Az egyszerűbb kivitelű belső képek szokásos formátuma.gif. <img src = portrait.gif alt = Lajos > A thumbnail képek alkalmazása.

14 Képformátumok

15 Számozatlan lista A számozatlan lista (unordered list) egyszerű felsorolásra alkalmas. Megadása: <ul> <li> Tanulmányi Osztály <li> Felnőttképzési Központ </ul> A listajelek megjelenítése nem szabványos, különböző böngészők esetében eltérő lehet.

16 Számozott lista A számozott lista (ordered list) rendezett listák készítésére alkalmas. Megadása: <ol> <li> Tanulmányi Osztály <li> Felnőttképzési Központ </ol> Ennek hatására a listaelemek sorszámozva (1., 2.,, stb.) jelennek meg.

17 Előre formázott szöveg Időnként szükség lehet előre formázott szöveg (preformatted text) használatára. Például C# program forráskódjának beillesztése úgy, hogy az olvashatóságot biztosító bekezdések megmaradjanak. Megadása: <pre> </pre>

18 Egyéb elemek Idézet (blockquote) Megadása: <bq> </bq> Sortörés (line break) Megadása: Nem hagy ki sort, mint a tag. Vízszintes vonal (horizontal rule) Az oldal tagolására szolgál. Megadása: <hr>

19 Ajánlott freeware szoftverek NoteTab 7.0 Light Easy Thumbnails 3.0 HTML Tidy Online CSS Toolbox Paint.NET 4.05 Komodo Edit Aptana Studio 3.6.0

20 Ajánlott kereskedelmi szoftverek Adobe Dreamweaver CS6 Blumental HTMLPad 2015 Coffecup HTML Editor 15.1 Microsoft Office Frontpage 2003 Microsoft Expression Web 4 NoteTab 7.0 Pro

Hasonló dokumentumok

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

HTML kódok. A www jelentése World Wide Web. HTML kódok A www jelentése World Wide Web. A HTML (angolul: HyperText Markup Language=hiperszöveges jelölőnyelv) egy leíró nyelv, melyet weboldalak készítéséhez fejlesztettek ki. A honlap felépítése (csak