VJEŽBE #1 IZ PREDMETA WEB DIZAJN Primjer 1. Prvi program u HTMLu. <HTML> <HEAD><TITLE>Ovo je naslov</TITLE></HEAD> <BODY> TEKST KOJI SE PRIKAZUJE </BODY> </HTML> Primjer 2. Ispisivanje naslova različitih veličina. <HTML> <HEAD><TITLE>Naslovi</TITLE></HEAD> <BODY> <H1> Naslov H1 </H1> <H2> Naslov H2 </H2> <H3> Naslov H3 </H3> <H4> Naslov H4 </H4> <H5> Naslov H5 </H5> <H6> Naslov H6 </H6> </BODY> </HTML> Primjer 3. Primjeri osnovnih tagova unutar HTML stranice. <HTML> <HEAD><TITLE>Primjeri osnovnih tagova</TITLE></HEAD> <BODY> <H2><P ALIGN=CENTER> HTML</P> </H2> <HR> <P ALIGN=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 ALIGN=RIGHT>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 ALIGN=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 ALIGN=CENTER>HTMLje <DIV ALIGN=LEFT>hiper-</DIV> <DIV ALIGN=CENTER>tekst-</DIV> <DIV ALIGN=RIGHT>Markup jezik.</DIV> Kad savladate osnove HTML-a mozete preci na upoznavanje JavaScripta </P> </BODY> </HTML> Primjer 4. Rad sa velicinom fonta <html> <head><title> Velicina fonta</title> </head> <body> <FONT SIZE = 1> Velicina fonta 1 </FONT><BR> <FONT SIZE = 2> Velicina fonta 2 </FONT><BR> <FONT SIZE = 3> Velicina fonta 3 </FONT><BR> <FONT SIZE = 4> Velicina fonta 4 </FONT><BR> <FONT SIZE = 5> Velicina fonta 5 </FONT><BR> <FONT SIZE = 6> Velicina fonta 6 </FONT><BR> <FONT SIZE = 7> Velicina fonta 7 </FONT><BR> </body> </html> Primjer 5. Primjer paragrafa. <html> <head> <TITLE> HTML Primjer</TITLE> </head> <body> <H1>HTML Uvod</H1> <P> Ovo je primjer prvog paragrafa. Koji se radi na prvom casu. </P> <P>Drugi paragraf.</P> <P ALIGN=CENTER> Ovo je centrirani paragraf </P> </body> </html> Primer 6. Primjer opisne liste <HTML> <HEAD> <TITLE>Opisne liste</TITLE> </HEAD> <BODY> <DL> <DT>piko<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> <TITLE>Numerisane liste</TITLE> </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> <TITLE>Nenumerisane liste</TITLE> </HEAD> <BODY> <UL>Tokom zime ima <LI>jabuka <LI>limuna <LI>grejpfruta i <LI>banana. </UL> </BODY> </HTML> Primjer 9. Primjer numerisane liste <html> <body> <h4>Numerisana lista - Brojevi:</h4> <ol> <li>Jabuke</li> <li>Banane</li> <li>Limuni</li> <li>Pomorandze</li> </ol> <h4>Numerisana lista – Velika slova:</h4> <ol type="A"> <li>Jabuke</li> <li>Banane</li> <li>Limuni</li> <li>Pomorandze</li> </ol> <h4>Numerisana lista – Mala slova:</h4> <ol type="a"> <li>Jabuke</li> <li>Banane</li> <li>Limuni</li> <li>Pomorandze</li> </ol> <h4>Numerisana lista – Veiliki rimski brojevi:</h4> <ol type="I"> <li>Jabuke</li> <li>Banane</li> <li>Limuni</li> <li>Pomorandze</li> </ol> <h4>Numerisana lista – Mali rimski brojevi:</h4> <ol type="i"> <li>Jabuke</li> <li>Banane</li> <li>Limuni</li> <li>Pomorandze</li> </ol> </body> </html> Primjer 10. Primjer nenumerisane liste <html> <body> <h4>Nenumerisana lista – Ispunjen krug:</h4> <ul type="disc"> <li>Jabuke</li> <li>Banane</li> <li>Limuni</li> <li>Pomorandze</li> </ul> <h4> Nenumerisana lista – Prazan krug:</h4> <ul type="circle"> <li>Jabuke</li> <li>Banane</li> <li>Limuni</li> <li>Pomorandze</li> </ul> <h4> Nenumerisana lista – Ispunjen kvadrat:</h4> <ul type="square"> <li>Jabuke</li> <li>Banane</li> <li>Limuni</li> <li>Pomorandze</li> </ul> </body> </html> Primer 11. Primjer liste unutar liste <html> <body> <h4>Lista unutar liste (Ugnijezdjena lista):</h4> <ul> <li>Kafa</li> <li>Caj <ul> <li>Crni caj</li> <li>Zeleni caj</li> </ul> </li> <li>Mlijeko</li> </ul> </body> </html> Primer 12. Primjer neuređene liste <html> <body> <h4>Neuredjena lista</h4> <dl> <dt>Kafa</dt> <dd>Crni topli napitak</dd> <dt>Mlijeko</dt> <dd>Bijeli hladni napitak</dd> </dl> </body> </html> Primer 13. Boje pozadine i slova <HTML> <HEAD> <TITLE> Boje pozadine i slova</TITLE> </HEAD> <BODY BGCOLOR="#FFFF00" TEXT="#FF0000"> <H1>Ovaj naslov je crven zbog atributa TEXT</H1> <BR><BR> <H1><FONT COLOR="#0000FF"> a ovaj naslov je plav zbog etikete FONT </FONT> </H1> </BODY> </HTML> Primer 14. Boje atributa u tagu BODY <HEAD> <TITLE> Atributi u tagu BODY</TITLE> </HEAD> <BODY TEXT="#000000" BGCOLOR="#FFFFFF" LINK="#990000" VLINK="#660000" ALINK="#ff0000"> <H1>Iz teksta na bijeloj pozadini sa crnim slovima<BR> poziva se <a href="ex0901.html">ovdje</a> tekst<BR> iz prethodnog primjera. <BR><BR> <UL> <LI><Font COLOR="#990000"> Boja za atribut LINK</FONT> <LI><Font COLOR="#660000"> Boja za atribut VLINK</FONT> <LI><Font COLOR="#FF0000"> Boja za atribut ALINK</FONT> </UL> </H1> </BODY> </HTML>
© Copyright 2024 Paperzz