HTML – nastavak br.4!!

HTML – nastavak br.4!!HTML – nastavak br.4!!

Minimalni HTML-dokument:Minimalni HTML-dokument:

<HTML> <HTML>

<HEAD><HEAD>

<TITLE>Prazno</TITLE><TITLE>Prazno</TITLE>

</HEAD></HEAD>

<BODY> <BODY>

</BODY></BODY>

</HTML> </HTML>

Nenumerisane listeNenumerisane liste

<ul> <ul>

<li>Stavka 1</li> <li>Stavka 1</li>



</ul> </ul>

Numerisane listeNumerisane liste

<ol> <ol>




</ol> </ol>

<HTML><HTML><HEAD><HEAD>

<TITLE>Lista unutar liste</TITLE> <TITLE>Lista unutar liste</TITLE> </HEAD> </HEAD> <BODY> <BODY>

<UL>Mala lekcija iz geografije<UL>Mala lekcija iz geografije<LI>Nekoliko država Evrope: <LI>Nekoliko država Evrope:

<UL> <LI>Italija </LI><UL> <LI>Italija </LI> <LI>Engleska</LI><LI>Engleska</LI>

<LI>Austrija </LI><LI>Austrija </LI></UL> </LI></UL> </LI>

<LI>Dve države u Aziji: <LI>Dve države u Aziji: <UL> <LI>Kina </LI><UL> <LI>Kina </LI> <LI>Iran </LI><LI>Iran </LI>

</UL> </LI></UL> </LI></UL> </UL>

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

Lista u listiLista u listi

AtributiAtributi

<h2 style="background-<h2 style="background-color:#ff0000;">Moje druzenje sa color:#ff0000;">Moje druzenje sa HTML</h2> HTML</h2>

AtributiAtributi

<body style="background-color:#ff0000;"><body style="background-color:#ff0000;">

ja volim informatikuja volim informatiku

Kako stranica postaje crvena?Kako stranica postaje crvena?

White: #ffffffWhite: #ffffffBlack: #000000 (zeros)Black: #000000 (zeros)Red: #ff0000Red: #ff0000Blue: #0000ffBlue: #0000ffGreen: #00ff00Green: #00ff00Yellow: #ffff00Yellow: #ffff00

<body style="background-color: red;"> <body style="background-color: red;">

Koji elementi mogu da koriste Koji elementi mogu da koriste atribute?atribute?

• Neki atributi su “ukrojeni” za pojedine Neki atributi su “ukrojeni” za pojedine elemente, a neki – za veliki broj razlielemente, a neki – za veliki broj različitih čitih elemenata.elemenata.

• Neki atributi mogu da sadrže jedan skup Neki atributi mogu da sadrže jedan skup elemenata, drugi mnoge različite.elemenata, drugi mnoge različite.

• Vrlo su logični i laki za upotrebuVrlo su logični i laki za upotrebu

Pravilo za atributePravilo za atribute

<h2 style="background-color:#ff0000;"> Moje druzenje sa HTML </h2><h2 style="background-color:#ff0000;"> Moje druzenje sa HTML </h2>

AtributAtribut

ElementElement

Startni tagStartni tag SadrSadržajžaj Krajnji Krajnji tagtag

Linkovi – vezeLinkovi – veze

• Kako se kreiraju veze izmedju stranica?Kako se kreiraju veze izmedju stranica?

• ZaZašto nam je potrebno da to znamo?što nam je potrebno da to znamo?

• Lokacija koja se otvara ne mora biti Lokacija koja se otvara ne mora biti isključivo Web strana, već bilo koji isključivo Web strana, već bilo koji dokument, slika, arhivirana datoteka, mul-dokument, slika, arhivirana datoteka, mul-timedijalni materijali i slično. timedijalni materijali i slično.

• Koristimo jednostavan element sa jednim Koristimo jednostavan element sa jednim atributom za povezivanje svega sa svime.atributom za povezivanje svega sa svime.


<a href="http://www.gimbab.edu.rs/">Veza <a href="http://www.gimbab.edu.rs/">Veza na nas zvanican sajt!!!</a>na nas zvanican sajt!!!</a>


• Linkovi na Web strani se prave pomoću Linkovi na Web strani se prave pomoću <a> oznake (a je skraćeno od anchor - <a> oznake (a je skraćeno od anchor - sidro). sidro).

Atributi ove oznake su: Atributi ove oznake su:

• href href - (hyperlink reference) koji označava - (hyperlink reference) koji označava lokaciju na koju se preusmerava Web lokaciju na koju se preusmerava Web pretrapretražživač kada korisnik klikne na link. ivač kada korisnik klikne na link. Ne zaboravite "http://" za punu adresuNe zaboravite "http://" za punu adresu


• Mogu se definisati veze unutara jedne Mogu se definisati veze unutara jedne stranice.stranice.

• Sve Sve što je potrebno je atribut što je potrebno je atribut id (identification) i id (identification) i simbol "#“simbol "#“

• Id atribut markira element ka linku:Id atribut markira element ka linku:<h1 <h1 id="naslov1"id="naslov1">Naslov 1</h1> >Naslov 1</h1>

• Sada je moguće kreirati link korišćenjem "#“ u Sada je moguće kreirati link korišćenjem "#“ u atributu veze. "#“ mora da bude u paru sa id.atributu veze. "#“ mora da bude u paru sa id.<a <a href="#naslov1“href="#naslov1“ >Veza ka naslovu 1 </a> >Veza ka naslovu 1 </a>

<html><html><head> </head><head> </head>

<body><body><a href="http://www.gimbab.edu.rs/">Veza na nas <a href="http://www.gimbab.edu.rs/">Veza na nas

zvanican sajt!!!</a>zvanican sajt!!!</a>

<p><a href="#naslov1">Veza ka naslovu 1</a></p><p><a href="#naslov1">Veza ka naslovu 1</a></p><p><a href="#naslov2">Veza ka naslovu 2</a></p><p><a href="#naslov2">Veza ka naslovu 2</a></p>

<h1 id="naslov1">naslov 1</h1><h1 id="naslov1">naslov 1</h1><p>Text text text text</p><p>Text text text text</p>

<h1 id="naslov2">Naslov 2</h1><h1 id="naslov2">Naslov 2</h1><p>Text text text text</p><p>Text text text text</p>

</body></body>

</html></html>


Još neki atributi Još neki atributi

• Za kreiranje linkova href atribut je obavezanZa kreiranje linkova href atribut je obavezan• Mogu se staviti i naslovi na link:Mogu se staviti i naslovi na link:

<a href="http://www.gimbab.edu.rs/" <a href="http://www.gimbab.edu.rs/" title=“Posetite najbolju školu na title=“Posetite najbolju školu na svetu">Gimnazija Vuk Karadzic Babusnica</a>svetu">Gimnazija Vuk Karadzic Babusnica</a>

• Atribut naslova se koristi za kratak opis linka. Atribut naslova se koristi za kratak opis linka.


• target target – označava na koji način će se otvoriti link. Ako – označava na koji način će se otvoriti link. Ako ne navedete ovaj atribut, podrazumevano je da će nova ne navedete ovaj atribut, podrazumevano je da će nova strana da se otvori u istom prozoru (ili kartici) i zameniti strana da se otvori u istom prozoru (ili kartici) i zameniti Web stranu na kojoj je link. Ako želite da se strana na Web stranu na kojoj je link. Ako želite da se strana na koju ukazuje link otvori u novom prozoru (ili kartici) Web koju ukazuje link otvori u novom prozoru (ili kartici) Web pretraživača, navedite ovaj atribut i postavite njegovu pretraživača, navedite ovaj atribut i postavite njegovu vrednost na vrednost na "_blank""_blank". .

• Na primer, ako želimo da postavimo link ka matičnoj Na primer, ako želimo da postavimo link ka matičnoj strani Microsoft-a i da ga otvorimo u novom prozoru (ili strani Microsoft-a i da ga otvorimo u novom prozoru (ili kartici) Web pretraživača, HTML kod bi izgledao ovako: kartici) Web pretraživača, HTML kod bi izgledao ovako:

• <a href="http://www.microsoft.com" target="_blank">Link <a href="http://www.microsoft.com" target="_blank">Link za Microsoft Web sedište</a> za Microsoft Web sedište</a>

Documents

HTML – nastavak br.4!!