Presentation is loading. Please wait.

Presentation is loading. Please wait.

Hyper Text Markup Language

Similar presentations


Presentation on theme: "Hyper Text Markup Language"— Presentation transcript:

1 Hyper Text Markup Language
Uvod u HTML Hyper Text Markup Language

2 HTML jezik HTML: je jezik za opis web strana
nije programski jezik, već jezik za obeležavanje – markup language kod se prenosi http (Hyper Text Transfer Protocol) protokolom koristi markup tag-ove za opis web strana kod se kombinuje sa običnim tekstom kod se nalazi na web strani *.htm(l) kod interpretira web browser

3 Html tags (tag-ovi) Html tagovi su specijalne reči između zagrada
Html tagovi se koriste u parovima kao <b> i </b> Prvi tag u paru je početni tag, a tag sa kosom crtom - / završni tag Iako se negde završni tag može izostaviti, trebalo bi da se uvek koriste u paru Html element se sastoji od para tagova, početnog i završnog

4

5 Html - jednostavan primer
<head> <title>Naslov web strane</title> </head> <body> <h1>Naslov prvog nivoa</h1> <p>Tekst paragrafa</p> </body </html>

6 Izgled prethodne web strane primer.html u web browser-u

7 Alat koji se koristi za razvoj / editovanje html koda
Bilo koji editor, na pr. Notepad Wordpad – windows, ne boji sintaksu

8 Notepad

9 wordpad

10 Osnovni html tagovi <html> i </html> tagovi označavaju početak i kraj čitave web strane Na web strani postoje dva dela nevidljivi i vidljivi koji se prikazuje u prozoru browser-a Nevidljivi deo web strane se nalazi između tagova <head> i </head> U nevidljivom delu web strane se nalaze tzv. meta tag-ovi koji se ne prikazuju već opisuju šta se nalazi na web strani. Meta informacije su informacije o informacijama

11 Vidljivi deo web strane
Vidljivi deo web strane je između tagova <body> i </body> Tagovi <h1> i </h1> označavaju najveća slova za naslov najvišeg nivoa Shodno tome, postoje h1(najveći) – h6 (najmanji) Tagovi <p> i </p> označavaju paragraf – deo teksta ispred i iza koga je po jedan prazan red Zadnji tag </p> nije neophodan (za sada) ali ga treba stavljati

12 Tagovi h1 – h6 <h1>This is heading 1</h1> <h2>This is heading 2</h2> <h3>This is heading 3</h3> <h4>This is heading 4</h4> <h5>This is heading 5</h5> <h6>This is heading 6</h6>

13 Tagovi h1 – h6 web strana h1h6.htm

14 Komentari u html-u <!-- This is a comment -->
Sve što se nalazi između oznaka <!-- i --> je komentar, i to se zanemaruje – kao da nije ni prisutno na web strani Smisao je potpuno isti kao i u drugim jezicima, komentari za lakšu analizu listinga, kao i deo listinga koji je potrebno trenutno skloniti (radi testiranja na pr.) ali se ne želi brisanje

15 Novi red tag <br/>
Tag <br/> označava novi red u okviru istog paragrafa Razlika u odnosu na paragraf je da se ne kreira prazan red između. Tag <br/> je jednostavan - prazan tag koji nema završni tag, dakle nema, ne postoji </br> Može da se koristi i samo tag <br>, ali se ne preporučuje, tj. preporučuje se </br> za budućnost, da ih budući čitači mogu pravilno interpretirati

16 Tag <hr/> horizontalna linija
<p>This is a paragraph1 <br/>New line1 </p> <hr /> <p>This is a paragraph2 <br/>New line2 </p> <hr /> <p>This is a paragraph3 <br/>New line3 </p>

17 Prikaz <hr/> u browser-u

18 Formatiranje teksta u html-u
<body> <p><b>This text is bold</b></p> <p><strong>This text is strong</strong></p> <p><big>This text is big</big></p> <p><em>This text is emphasized</em></p> <p><i>This text is italic</i></p> <p><small>This text is small</small></p> <p>This is<sub> subscript</sub> and <sup>superscript</sup></p> <p><del>This is deleted text</del></p> <p><ins>This is inserted text</ins></p> </body> </html>

19 Html formati u browser-u

20 Tagovi za formatiranje
<b> </b> bold - masna slova <strong> </strong> između bold i regular <big> </big> uvećana slova <em> </em> emphasized - naglašena slova <i> </i> italics – kurziv kao pisana i zakošena slova <small> </small> umanjena slova <sub> </sub> subscript – subskript, indeks <sup> </sup> superscript – superskript, izložilac <del> </del> deleted – izbrisana, precrtana slova <ins> </ins> inserted – umetnuta slova

21 Dodatna uputstva na www.w3.org/MarkUp/Guide Dave Raggett
(Osnovno i napredno uputstvo za HTML)


Download ppt "Hyper Text Markup Language"

Similar presentations


Ads by Google