You are on page 1of 10

VJEŽBE #1 IZ PREDMETA WEB DIZAJN

Primjer 1. Prvi program u HTMLu.

<HTML>
<HEAD><TI TLE>Ovo j e nasl ov</ TI TLE></ HEAD>
<BODY>
TEKST KOJ I SE PRI KAZUJ E
</ BODY>
</ HTML>


Primjer 2. Ispisivanje naslova različitih veličina.

<HTML>
<HEAD><TI TLE>Nasl ovi </ TI TLE></ HEAD>
<BODY>
<H1> Nasl ov H1 </ H1>
<H2> Nasl ov H2 </ H2>
<H3> Nasl ov H3 </ H3>
<H4> Nasl ov H4 </ H4>
<H5> Nasl ov H5 </ H5>
<H6> Nasl ov H6 </ H6>
</ BODY>
</ HTML>


Primjer 3. Primjeri osnovnih tagova unutar HTML stranice.
<HTML>
<HEAD><TI TLE>Primjeri osnovnih tagova</ TI TLE></ HEAD>
<BODY>
<H2><P ALI GN=CENTER> HTML</ P> </ H2>
<HR>
<P ALI GN=LEFT>HTML (HyperText Markup Language) je veoma
jednostavan
jezik cije osnove svako moze da se brzo savlada. U okviru ovog kursa
proucavaju se osnove HTML-a koje su dovoljne da se naprave
jednostavne ali
sasvim zadovoljavajuce prezentacije.
</ P> <HR>
<P ALI GN=RI GHT>Svaki put kada krstareci internetom naletite na neku
zanimljivu stranicu, a ne znate kako je napravljena, njen izvorni HTML
kod
mozete pogledati ako u liniji menija odaberete: View -> Source (ili View

Page Source u Internet Explorer-u).
</ P>
<HR>
<P ALI GN=CENTER>HTML se koristi i u okviru <BR>
ASP stranica<BR>
JSP stranica, <BR>
Zajedno sa JavaScriptom <BR>
ili PHP jezikom <BR>
ili nekim drugim script jezikom</ P><HR>
<P ALI GN=CENTER>HTMLje
<DI V ALI GN=LEFT>hiper-</ DI V>
<DI V ALI GN=CENTER>tekst-</ DI V>
<DI V ALI GN=RI GHT>Markup jezik.</ DI V>
Kad savladate osnove HTML-a mozete preci na
upoznavanje JavaScripta
</ P>
</ BODY>
</ HTML>

Primjer 4. Rad sa velicinom fonta
<ht ml >
<head><t i t l e> Vel i ci na f ont a</ t i t l e>
</ head>
<body>
<FONT SI ZE = 1> Vel i ci na f ont a 1 </ FONT><BR>
<FONT SI ZE = 2> Vel i ci na f ont a 2 </ FONT><BR>
<FONT SI ZE = 3> Vel i ci na f ont a 3 </ FONT><BR>
<FONT SI ZE = 4> Vel i ci na f ont a 4 </ FONT><BR>
<FONT SI ZE = 5> Vel i ci na f ont a 5 </ FONT><BR>
<FONT SI ZE = 6> Vel i ci na f ont a 6 </ FONT><BR>
<FONT SI ZE = 7> Vel i ci na f ont a 7 </ FONT><BR>
</ body>
</ ht ml >





Primjer 5. Primjer paragrafa.
<ht ml >
<head>
<TI TLE> HTML Pr i mj er </ TI TLE>
</ head>
<body>
<H1>HTML Uvod</ H1>
<P> Ovo je primjer prvog paragrafa.
Koji se radi na prvom casu.
</ P>
<P>Drugi paragraf.</ P>
<P ALI GN=CENTER>
Ovo je centrirani paragraf
</ P>
</ body>
</ ht ml >




Primer 6. Primjer opisne liste
<HTML>
<HEAD>
<TI TLE>Opisne liste</ TI TLE>
</ HEAD>
<BODY>
<DL>
<DT>pi ko-
<DD> prefiks nekoj jedinici koji pokazuje milioniti
deo
milionitog dela te jedinice;
<DT>nano-
<DD> prefiks nekoj jedinici koji pokazuje milijarditi
deo te jedinice;
<DT>mikro-
<DD> prefiks nekoj jedinici koji pokazuje milioniti
deo
te jedinice;
</ DL>
</ BODY>
</ HTML>

Primjer 7. Primjer numerisane liste

<HTML>
<HEAD>
<TI TLE>Numerisane liste</ TI TLE>
</ HEAD>
<BODY>
<OL>Predmeti na 1. godini SPR-a
<LI >Aplikativni softver
<LI >Inženjerska matematika
<LI >Osnovi elektrotehnike
<LI >Osnovi elektronike
<LI >Osnovi racunarstva

</ OL>
</ BODY>
</ HTML>




Primer 8. Primjer nenumerisane liste

<HTML>
<HEAD>
<TI TLE>Nenumerisane liste</ TI TLE>
</ HEAD>
<BODY>
<UL>Tokom zime ima
<LI >jabuka
<LI >limuna
<LI >grejpfruta i
<LI >banana.
</ UL>
</ BODY>
</ HTML>

Primjer 9. Primjer numerisane liste
<ht ml >
<body>
<h4>Numerisana lista - Brojevi:</ h4>
<ol >
<l i >Jabuke</ l i >
<l i >Banane</ l i >
<l i >Limuni</ l i >
<l i >Pomorandze</ l i >
</ ol >
<h4>Numerisana lista – Velika slova:</ h4>
<ol t ype=" A" >
<l i >Jabuke</ l i >
<l i >Banane</ l i >
<l i >Limuni</ l i >
<l i >Pomorandze</ l i >
</ ol >
<h4>Numerisana lista – Mala slova:</ h4>
<ol t ype=" a" >
<l i >Jabuke</ l i >
<l i >Banane</ l i >
<l i >Limuni</ l i >
<l i >Pomorandze</ l i >
</ ol >
<h4>Numerisana lista – Veiliki rimski brojevi:</ h4>
<ol t ype=" I " >
<l i >Jabuke</ l i >
<l i >Banane</ l i >
<l i >Limuni</ l i >
<l i >Pomorandze</ l i >
</ ol >
<h4>Numerisana lista – Mali rimski brojevi:</ h4>
<ol t ype=" i " >
<l i >Jabuke</ l i >
<l i >Banane</ l i >
<l i >Limuni</ l i >
<l i >Pomorandze</ l i >
</ ol >
</ body>
</ ht ml >




Primjer 10. Primjer nenumerisane liste

<ht ml >
<body>
<h4>Nenumerisana lista – Ispunjen krug: </ h4>
<ul t ype=" di sc" >
<l i >Jabuke</ l i >
<l i >Banane</ l i >
<l i >Limuni</ l i >
<l i >Pomorandze</ l i >

</ ul >
<h4>Nenumerisana lista – Prazan krug: </ h4>
<ul t ype=" ci r cl e" >
<l i >Jabuke</ l i >
<l i >Banane</ l i >
<l i >Limuni</ l i >
<l i >Pomorandze</ l i >

</ ul >
<h4>Nenumerisana lista – Ispunjen kvadrat: </ h4>
<ul t ype=" squar e" >
<l i >Jabuke</ l i >
<l i >Banane</ l i >
<l i >Limuni</ l i >
<l i >Pomorandze</ l i >
</ ul >
</ body>
</ ht ml >




Primer 11. Primjer liste unutar liste

<ht ml >
<body>
<h4>Lista unutar liste (Ugnijezdjena lista):</ h4>
<ul >
<l i >Kafa</ l i >
<l i >Caj
<ul >
<l i >Crni caj</ l i >
<l i >Zeleni caj</ l i >
</ ul >
</ l i >
<l i >Mlijeko</ l i >
</ ul >
</ body>
</ ht ml >




Primer 12. Primjer neuređene liste

<ht ml >
<body>
<h4>Neuredjena lista</ h4>
<dl >
<dt >Kafa</ dt >
<dd>Crni topli napitak</ dd>
<dt >Mlijeko</ dt >
<dd>Bijeli hladni napitak</ dd>
</ dl >
</ body>
</ ht ml >



Primer 13. Boje pozadine i slova

<HTML>
<HEAD>
<TI TLE> Boj e pozadi ne i sl ova</ TI TLE>
</ HEAD>
<BODY BGCOLOR=" #FFFF00" TEXT=" #FF0000" >
<H1>Ovaj nasl ov j e cr ven zbog at r i but a
TEXT</ H1>
<BR><BR>
<H1><FONT COLOR=" #0000FF" >
a ovaj nasl ov j e pl av zbog et i ket e FONT
</ FONT>
</ H1>
</ BODY>
</ HTML>


Primer 14. Boje atributa u tagu BODY
<HEAD>
<TI TLE> Atributi u tagu BODY</ TI TLE>
</ HEAD>
<BODY TEXT=" #000000" BGCOLOR=" #FFFFFF"
LI NK=" #990000" VLI NK=" #660000"
ALI NK=" #f f 0000" >
<H1>Iz teksta na bijeloj pozadini sa crnim slovima<BR>
poziva se <a hr ef =" ex0901. ht ml " >ovdje</ a>
tekst<BR>
iz prethodnog primjera. <BR><BR>
<UL>
<LI ><Font COLOR=" #990000" > Boja za atribut
LI NK</ FONT>
<LI ><Font COLOR=" #660000" > Boja za atribut
VLI NK</ FONT>
<LI ><Font COLOR=" #FF0000" > Boja za atribut
ALI NK</ FONT>
</ UL>
</ H1>
</ BODY>
</ HTML>