3. Osnove HTML-a - webdizajn.ict.edu.rs · Web dizajn Dr Nenad Koji ć . HTML - PODSEĆANJE...

Osnove HTML -A

Web dizajn

Dr Nenad Kojić

HTML - PODSEĆANJE

� HyperText Markup Language

� HTML predstavlja jezik za označavanje hiperteksta ihipermedija (teksta, slike, zvuka, videa i drugih međusobno povezanih objekata pomoću linkova)međusobno povezanih objekata pomoću linkova)

� HTML predstavlja tekstualnu datoteku� Bilo koji tekst editor je prihvatljiv za izradu HTML

dokumenata

� Namenjen browser-ima koji ga dobijaju od web servera i grafički prikazuju sadržaj sajta

Gradivne komponente jezika

� HTML dokument je sastavljen od tagova� otvarajući tag: <IME_ELEMENTA>� zatvarajući tag: </IME_ELEMENTA>

� Osim imena HTML elementa, tag čini i određeni broj atributa, čije su vrednosti uokvirene navodnicimaatributa, čije su vrednosti uokvirene navodnicima

� Element govori browser-u šta da uradi, a atribut kako da to uradi

� Razlika između malih i velikih slova ne postoji (title = Title = tiTLe), ali je bolje da budu mala

� Pri prikazivanju stranica browser-i se oslanjaju na informacije date u tagovima

� HTML kod se realizuje redosledom kojim je i pisan

Tagovi

� Upareni tagovi su oznake kojima se u HTML stranu postavlja tekst ili neki drugi objekat

� Upareni tagovi imaju početak i i kraj� Ove oznake moraju da imaju simbol kojim se neki tag

počinje i simbol kojim se završava(<tag></tag>)(<tag></tag>)

� Ceo tekst ili skup tagova unutar ove dve oznake se prevodi samo u svojstvu značenja tih oznaka

� Izvan taga, efekat taga ne postoji� Svaki tag ima tačno definisan grafički izgled

� Uparene oznake su uvedene radi lakšeg praćenja i čitanja koda

Osnovni HTML tagovi

Tagovi koji opisuju osnovnu strukturu HTML dokumenta:�HTML�HEAD�BODY

• Tag <HTML> je okvir u kome se nalaze svi ostali tagovi; HTML • Tag <HTML> je okvir u kome se nalaze svi ostali tagovi; HTML dokument uvek počinje tagom <HTML>, a završava se tagom </HTML>

• Tag <HEAD> uokviruje zaglavlje u kome se nalaze informacije o samom dokumentu (naslov, opis, ključne reči, ime autora, itd.) i gde se pišu svi viši programski script jezici (npr. Java Script)

• Sve ono što vidimo u prozoru browser-a, tj. sadržina stranice, nalazi se u telu dokumenta koje uokviruje element <BODY>; u dokumentu sme da postoji samo jedan par tagova <BODY> </BODY>

Naslov web strane

� Skoro svi tagovi koji su namenjeni korisniku nalaze se u body tagu

� Jedan od retkih izutetaka je regularni tag TITLE� On se piše u head tagu, i definiše naslov strane� Ovaj naslov je vidljiv za korisniika i nalazi se u zaglavlju � Ovaj naslov je vidljiv za korisniika i nalazi se u zaglavlju

browsera� Obzirom da nije u telu sajta, piše se kroz tag head, a ne

body

Sintaksa - primer

� Početak i kraj HTML odeljka<html> Ovde je cela strana </html>

� Početak i kraj zaglavlja (odmah iza html-a)<head> Ovde je zaglavlje (ne vidi) </head>

� Početak i kraj tela stranice<body> Ovde je telo stranice </body>

� Početak i kraj naslova strane, unutar head dela<title> Ovde je tekst naslova (vrh) </title>

Primer web stranice

<HTML> <HEAD>

<TITLE> Moja prva Web stranica </TITLE></HEAD>

<BODY> Dobar dan!

</BODY></HTML>

Snimanje koda

� Kod se može pisati u bilo kom text editoru� Preporuka je da to bude Notepad++ (http://notepad-plus-

plus.org/)� Nakon pisanja koda, treba izabrati File/SaveAs i podesiti

da tip bude HTML

Rad sa tekstom u HTML -u

Tekst sa srpskim slovima

� Obzirom da je podrazumevani kodni raspored engleski, prikaz drugih karaktera, koji su van engleskog pisma, mora se urediti na drugi način

� Ovo se realizuje pomoću meta taga� Kao i drugi meta podaci, i ovaj se definiše u Head tagu, i � Kao i drugi meta podaci, i ovaj se definiše u Head tagu, i

omogućava da se u browseru, ispravno prikazuju posebni karakteri

� U našem slučaju to je srpska ćirilica i latinica

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

Primer

<html>

<head><title>Definisanje tipa html-a i prikaza nacionalnih karaktera</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8"></head>

<body>Tekst sa srpskim slovima. <! - - Ovo je komentar - - >Sada se vide i slova Č, Š, Đ ,Ć i Ž Ћирилица такође: Ч, Ш, Ђ, Ћ, Љ, Њ, Џ и остала.</body>

</html>

Komentari

� Komentari postoje u svakom programskom jeziku, i služe da pomognu programerima sa napomenama i opisima koji se ostavljeni

� Komentari su delovi web stranice koji se ne interpretiraju, a samim tim i ne prikazuju korisniku.

� Uloga komentara je lakše snalaženje i navođenje unutar prezentacije

� Kometari su skoro obavezni kada više ljudi uređuje sajt, ili kada se koristi PHP pristup

� Sintaksa komentara je

<! -- tekst komentara -->

Neupareni tagovi

� Prazni (ne upareni) tegovi nemaju svoj početak, nego se realizuju na mestu na kome se na njih naiđe

� Obzirom da nemaju početak i kraj, deluju samo za sebe, a ne na neke druge tagove ili sadržaje

� Sintaksa ovih tagova je <ime/>

� Najčešće korišćenu su: , <hr/>, <input/>, <img/>, …

� Tag tumači se kao “skoči” na sledeći red (u grafičkom okruženju)

� Ova naredba je u nekim slučajevima isto što i Enter

� Horizontalne linije, za razdvajanje delova sadržaja, definišu se tagom <hr/>

Atributi

� Pored tagova, drugi gradivni elementi u HTML-u su atributi� Atributi pripadaju tagu, i ne mogu se pisati samostalno� Atribut preciznije definiše način kako se tag prikazuje u

browser-u� Atributi nisu obavezni, ali su nekada vrlo bitni i poželjni� Različiti tagovi imaju dozvoljene različite atribute� Imena atributa su unapred definisana jezikom, kao i njihove

vrednosti, tip i intervali, sem u slučaju stringa� Atributi se pišu pod znacima navoda� Jedan tag može imati više atributa

<tag atribut1=“12px” atribut2=“red” atribut3=“center”> ABC </trag>

Tag <hr/>

� On dodaje jednu horizontalnu liniju visine 1 do 2 mm, ispred i iza koje postoji prazan red

� Moguće je podesiti visinu korišćenjem atributa SIZE="n" (n je broj piksela), širinu pomoću atributa WIDTH="n" i poravnanje pomoću atributa ALIGN (moguće vrednosti su LEFT, RIGHT i CENTER)CENTER)

� Dužina linije je apsolutna dužina ili procenat dužine celog ekrana

� Primer<hr width=“100px”/><hr width=“75%”/><hr width=“25%”/>

Atributi taga <hr/>

� Align – poravnanje linije uz levu ili desnu stranu� Noshade – puna linija (bez senčenja)� Size – debljina linije� Width – dužina linije

� Primer<hr align="center" noshade size="5" width="150px">

Tagovi H1-H6

� Upareni tagovi <h1> do <h6> se koriste za definisanje veličine teskta

� Iako je definisanje veličine teksta mnogo preciznije CSS-om, skoro svi web pretraživači očekuju H tagove

� Primarna uloga H tagova je da se istaknu naslovi i podnaslovi� Postoje tagovi H1, H2, H3, H4, H5 i H6� Element H1 daje najveću veličinu slova, a H6 najmanju� Svaki od ovih elemenata počinje u novom redu, a browser-i

dodaju još malo praznog mesta pre njihovog prikaza

� U okviru taga se može navesti atribut ALIGN, koji određuje horizontalno poravnanje prikaza teksta; vrednost ovog atributa može biti jedna od sledećih: LEFT, CENTER, RIGHT

Primer

<html><head><title>Velicina slova</title>

</head></head><body><h1>Ovo je velicina slova u zaglavlju H1</h1><h2>Ovo je velicina slova u zaglavlju H2</h2><h3>Ovo je velicina slova u zaglavlju H3</h3><h4>Ovo je velicina slova u zaglavlju H4</h4><h5>Ovo je velicina slova u zaglavlju H5</h5><h6>Ovo je velicina slova u zaglavlju H6</h6>

</body></html>

Kreiranje pasusa

� Tag definiše kreiranje pasusa, koji počinje u novom redu

� U okviru taga (za kreiranje pasusa) može se navesti atribut ALIGN, koji određuje horizontalno poravnanje paragrafa; vrednost ovog atributa može biti jedna od paragrafa; vrednost ovog atributa može biti jedna od sledećih: LEFT, CENTER, RIGHT

� Ovo je pasus koji je centriran.

Primer

<html><head>

<title>Pasusi</title></head><body>

Ovo je prvi pasus.Ovo je drugi pasus.Ovo je drugi pasus. Ovo je treci pasus ispred kojeg je bio jedan prazan red. 

Ovo je pasus koji je desno poravnat.Ovo je pasus koji je centriran.

</body></html>

Entiteti

� Entiteti su specijalno definisane grupe karaktera, koje se kucaju u HTML kodu, i imaju unapred definisan način interpretacije u browser-u

� Koriste se da bi se prikazali neki karakteristični simboli� Obzirom da se ne prikazuju kao običan tekst, počinju � Obzirom da se ne prikazuju kao običan tekst, počinju

simbolom & a završavaju se sa ; pa ih tako browser prepoznaje

� space � < <� > >� € €

� © ©� ® ®� & & � " "� ' '

&nbsp ;

� Ukoliko je dužina nekog tekst velika, bez posebnog formatiranja (upotrebom taga za novi red , ili pasusa ) u zavisnosti od širine browser-a, tekst će se različito lomiti.

� Ukoliko su neke reči bitne da ostanu u grupi koristi se entitet

između tih reči

Npr: ……… Kojic Nenad …..

� Sa druge strane, jedino entitetom se može postići više od jednog space-a.

� Kucanjem više space-a sa tastature, unutar teksta, browser uvek prikazuje samo jedan.

Formatiranje teksta

� Formatiranje teksta: Bold, Italic i Underline je pomoću tagova� tekst � tekst � tekst 

<html><body> Za tekst tipa BOLD treba koristiti tag B. Tagovi se mogu i ugnježdavati sa ispravnim zatvaranjem tagova Za tekst tipa ITALIC treba koristiti tag I Kombinacija sva tri taga </body></html>

Tag font

� Tag font nema grafičku interpretaciju, ali se koristi da se kroz njegove atribute formatira tekst� � � � 

� Boja može biti ili engleska reč za boju ili heksadecimalni kod neke boje npr. green, blue, #008000, #FFFF00 ...

� Veličina može biti broj od -7 do 7� Ime fonta je neki od definisanih fontova Times New

Roman, Arial, Helvetica...

Primer – dodatni tagovi za formatiranje teksta<html><body>

Sledeci tekst ce prikazati upotrebu atributa za menjanje karakteristika teksta:Ovo je podebljan tekst.Ovo je iskosen tekst.Ovo je podvucen tekst.Ovo je podvucen tekst.

<basefont size="5">Ovo je font velicine 5.</basefont>Ovo su slova uobicajene velicine, <big>a ovo su slova za jedan veca od uobicajenih.</big>Ovo su slova uobicajene velicine, a ovo su slova za jedan manja od uobicajenih.Ovo je tekst crvene boje, slova su velicine 10.

</body></html>

Grafi čki izgled koda

Dodatni tagovi za formatiranje teksta

� <cite></cite> Istaknuti citati

� <del></del> Precrtani tekst

� <q></q> Znaci navoda

� Oznake indeksa� Oznake indeksa

� Oznake eksponenta

� Slova u kurzivu

� Polucrni kurziv oko slova

� <blockquote></blockquote> Citati

Boja

� Boja se definiše kroz atribut color, ili bgcolor� Može biti definisana kao engleska reč (blue, yellow,

green, red) ili kao broj� Preciznija definicija je brojna vrednost (heksadecimalna

predstava boje)

<html><head>

<title>Ovo je treci HTML dokument</title></head><body BGCOLOR="#FFFFAA" >

Primer

Ovo je tekst.

 </body>

</html>

Rad sa listama u HTML -u

Liste

� Postoje dva tipa listi (oblika nabrajanja): sa numeracijom i bez (neuređene)

� Tag za definisanje liste sa numeracijom je <ol></ol>� Unutar ovog taga nabrajaju se konkretne stavke, koje se zovu

elementi liste� Tag za svaki od elemenata liste je <li></li>� Tag za svaki od elemenata liste je <li></li>

� Inicijalna numeracija je po pravilu arapskim brojevima� U slučaju da se želi drugačiji način numeracije, koristi se tag

<ol> sa atributom type� Primer: <ol type”a”>, <ol type”A”>, <ol type”i”>, <ol type”I”>, ...� Definisanjem prvog slova ili broja, ostali se automatski dodaju

� Za počinjanje liste drugim brojem od 1 treba koristiti atribut start, npr. <ol start=“5”>

Primer

<ol><li>Mleko</li><li>Šećer</li><li>Keks</li><li>Sapun</li>

</ol>

<ol start="7"><li> pesma 1</li><li> pesma 2</li><li> pesma 3</li><li> pesma 4</li>

</ol>

Neuređene liste

� Za označavanje elemenata neuređene liste koristi se simbol <ul>

� Ovaj tip označavanja se može urediti posebnim grafičkim elementima primenom atributa type

� Primer:<ul type=“disc”> za crnu tačku<ul type=“square”> crni kvadrat<ul type=“circle”> crna kružnica

� Ugneždene liste se definišu na isti način kao i liste, ali unutar njih

Primer

<ul type="disc"><li>Lala</li><li>Ruža</li><li>Karanfil</li>

</ul>

<ul type="circle"><ul type="circle"><li>Supa</li><li>Glavno jelo</li><li>Dezert</li>

</ul>

<ul type="square"><li>Mercedes</li><li>Audi</li><li>Reno</li>

</ul>

Primer ugnježdenih listi

<ol start="1"><li>Bezalkoholna:

<ol><li>Čaj</li><li>Kafa</li><li>Sok</li></ol>

<ul><li>Stan

<ul><li>Jednosoban</li><li>Dvosoban</li>

</ul></li></ol>

</li><li>Alkoholna:

<ol start="4"><li>Votka</li><li>Vinjak</li><li>Pivo</li>

</ol></li></ol>

</li>

<li>Kuća<ul>

<li>Prizemna</li><li>Jednospratna</li><li>Višespratna</li>

</ul></li>

</ul>

Definicione liste

� Ove liste se koriste kod posebne vrste prikaza teksta� Definišu se pomoću tagova <dl>, <dt> i <dd>� Tag <dl></dl> se koristi za otvaranje i zatvaranje definicione

liste� Tag <dt></dt> se koristi za kreiranje naslova za stavke koje

se navode u listise navode u listi� Tag <dd></dd> se koristi za definisanje sadržaja svake od

navedenih stavki� Ove liste mogu da se kreiraju i ako se tagovi <dt> i <dd> ne

upare

Primer

<DL>

<DT> Prvi trimestar<DD> Traje od xxx do xxx</DD>

</DT>

<DT> Drugi trimestar<DT> Drugi trimestar<DD> Traje od xxx do xxx </DD>

</DT>

<DT> Treći trimestar<DD> Traje od xxx do xxx </DD>

</DT>

</DL>

Rad sa slikama u HTML -u

Referenciranje objekata

� Prostor na web serveru podeljen je kao i hard disk u direktorijume i foldere.

� Da bi se održao sadržaj web strane napravljene na personalnom računaru, koja u sebi sadrži i objekte (npr.slike) svi objekti se moraju definisati relativnim ili apsolutnimsvi objekti se moraju definisati relativnim ili apsolutnimputanjama.

� Relativna putanja se koristi kada se pozivaju objekti koji su sastavni deo posmatranog sajta (npr. slika A koja je deo sadržaja strane nesto.html). Putanja se bazira u odnosu na folder gde se nalazi html stranica.

� Apsolutna putanja se koristi kada se pozivaju objekti koji su van sajta ili na fiksnoj lokaciji (npr. slika B, koja se nalazi na drugom sajtu)

Primer

� Primer za sliku – pera.jpg, koja je u folderu A, unutar direktorijuma B (gde je i kod stranice html stranice), a sve ovo je na C disku

� Relativna putanja (fajl koji poziva je u istoj ravni gde i folder A)A/pera.jpg

� Apsolutna putanja (fajl koji poziva je bilo gde, pa se daje puna putanja - izbegavati)

C:A/B/pera.jpgwww.sajt.com/slike/pera.jpg

� U slučaju da je struktura foldera kompleksnija za apsolutnu putanju mora da se piše svaki delić putanje, dok se relativna ne menja

� Problem apsolutne putanje je promena lokacije i uređenja sajta

Slike

� Slika se definiše tagom <img />� Ključni atribut taga <img /> je src� Atribut src definiše putanju (source) i ime slike koja se želi

prikazati� Putanja može biti ili relativna ili apsolutna

<img src=“A/pera.jpg” /><img src=“A/pera.jpg” /><img src=“sajt.com/pera.jpg” />

� Veličina slike koja se prikazuje u browser-u je originalna veličina slike

� Promena prikaza veličine u browser-u, realizuje se atributima width i height

� Na ovaj način smanjuje se samo dimenzija ali ne i “težina” slike<img src=“pera.jpg” width=“400px” height=“200px” />

Atributi slike

� Veličina slike, definisana atributima width i height, može biti apsoluta (u pikselima) ili relativna (definisana u % u odnosu na originalnu veličinu slike)

� Često korišćen atribut je i alt. Ovaj atribut se koristi da bi se umesto slike (kada postoji problem sa učitavanjem) na mestu slike prikaže tekst definisan atributom alt.slike prikaže tekst definisan atributom alt.

� Atribut alt je vrlo bitan i za web pretraživače, obzirom da oni ne razumeju sastav slike, nego sliku vide kroz tekst (definisan u alt atributu)

� Slika može imati i atribut border, koji definiše okvir oko slike i atribut name, koji se ne vidi, ali se koristi da viši programski jezici mogu da prozovu sliku i izvrše neku akciju nad njom

� Atribut align se može koristiti za pozicioniranje slike

Primer

<body>Slika 1 – Originalna slika sa atributom alt koji ispisuje tekst ako nema slike <img src="slike/slika1.jpeg" alt="predeli Srbije"> 

Slika 2 – Definisanje atributa za apsolutnu visinu i dužinu slike <img src=" slike/slika1.jpeg" height=327 width=291 alt="predeli Srbije“> 

Slika 3– Definisanje atributa za relativnu visinu i dužinu slike <img src=" slike/slika1.jpeg" height=25% width=105% alt="predeli Srbije"> 

Slika 4 – Definisanje atributa za poravnanje slike align <img src=" slike/slika1.jpeg" height=150 width=180 alt="predeli Srbije“

align=”right”> 

Slika 5 – Definisanje atributa za poravnanje slike align i imena slike <img src=" slike/slika1.jpeg" height=15% width=15% alt="predeli Srbije“

align=”center” name="eksterijer" border=”10”> </body>

Problemi sa width i heigth

� Ukoliko se skaliranje dimenzija ne uradi proporcionalno za obe dimenzije, dobija se deformisana slika

Slika kao pozadina

� Definisanjem direktno u HTML kodu, pomoću atributa background, dobija se efekat slike kao pozadine dela ili celog sajta

<body background=“slika.gif">

� Definisanjem direktno u HTML kodu sa alternativom boje� Definisanjem direktno u HTML kodu sa alternativom boje<body background=" slika.gif“ bgcolor="#333333">

� Definisanje u CSS stilu (poželjno)body {

background-image: url(“slika.gif"); background-position: 50% 50%; background-repeat: no-repeat; }

Hiper veze - linkovi

Hiperveze

� Tag za link je <a></a>� Između <a> i </a> nalazi se tekst ili slika koja se prikazuje

korisniku kao vidljiv deo linka

� Klikom na taj tekst ili sliku, treba da se ukaže na neki fajl ili objekat (web stranu, sliku, video fajl, zip fajl, word dokument, ...)

� Atribut taga <a> kojim se definiše putanja i fajl na koji će se klikom na link ukazati definisan je atributom href

� Primer 1: Link ka web strani istog sajta<a href=“home.html”>Ovde pritisnuti da bi videli našu home stranu.</a>

� Primer 2: Link ka web strani druge web lokacije<a href=“http://nesto.com/index.htm”>Ovde pritisnuti da bi videli sajt

nesto.com .</a>

Primer

� Primer 3: Tekstualni link ka nekom fajlu

<a href=“http://www.nesto.com/web/mika.zip”> Ovde pritisnuti da bi skinuli mika.zip sa sajta www.nesto.com </a>

� Primer 4: Link (slika) ka web strani istog sajta<a href=“home.html”> <img src="slike/slika1.jpeg“/> </a>

Interno referenciranje ( anchor)<html><body>

<ol> <li> <a href="#1"> HTML</a></li><li> <a href="#2"> JavaScript</a></li><li> <a href="#3"> PHP</a></li>

</ol>

<h3> <a name="1"> HTML</a> </h3>Ovde ubaciti malo više teksta.

<h3> <a name="2"> JavaScript </a> </h3>Ovde ubaciti malo više teksta.

<h3> <a name="3"> PHP</A> </h3>Ovde ubaciti malo više teksta.

</body></html>

Formatiranje teksta linka

� Link ima tri faze koje se detektuju (inicijalna boja, boja u trenutku klika, i boja nakon klika na link)

� Ove tri faze se mogu pojedinačno definisati bojom� To se realizuje kroz tri atributa LINK, ALINK i VLINK� Ovi atributi se mogu definisati u tagu body i tada pravilo važi

za sve linkove u strani. Takođe, definišu se i u CSS-uza sve linkove u strani. Takođe, definišu se i u CSS-u

Atribut Opis

Link Boja linka pre nego što se aktivira

Alink Boja linka u trenutku aktiviranja

Vlink Boja linka nakon aktiviranja

Primer

<html><head>

<title>Ovo je strana o linkovima</title></head>

<body BGCOLOR="#CCFFAA" TEXT="blue" LINK="red" VLINK="green" ALINK="red">VLINK="green" ALINK="red">

<a href=“http://www.nesto.com/web/mika.zip”> Ovde pritisnuti da bi skinuli mika.zip sa sajta www.nesto.com </a>

 Neki tekst</body>

</html>

Link za mail

� Pravljenje linka kojim se automatski otvara Outlook Expressje istog formata kao i klasičan link, ali je u atributu hrefdefinisana adresa primaoca sa

mailto:[email protected]<a href="mailto:[email protected]">Kontakt</a>

� Pored osnovne adrese mogu se dodati i ostali atributi. Odvajaju se znakom ?, i & i nose fiksna imena promenljivih

<a href="mailto: [email protected] ?subject =Mail sa sajta &body =Dobar dan">Kontakt</a>

Dodavanje slike ispred URL adrese

<head><head><link rel="shortcut icon" href="ime.ico" / >

</head>

Multimedija

Pozadinski zvuk

<bgsound src=”imeaudiofajla.format” loop=”broj”>

� Ovaj fajl se kao i slika zapisuje kao ime i format.� Audio fajl se mora nalaziti u istom direktorijumu kao i kod,

inače se mora zadati putanja pre imena fajla.

� Formati koji su podržani u HTML-u su Wav, AU, MP3 i MIDI

� Broj koji se definiše u atributu LOOP određuje koliko puta se sekvenca ponavlja.

� Upisivanjem broja 2, ide dva puta i slično, dok stavljanjem -1ili infinite ponavlja se dok korisnik posmatra stranicu.

Zvuk

� Za veći broj multimedijalnih fajlova, kao i za zvuk, koristi se <EMBED> tag.

� Ovaj tag podržava uobičajene formate kao što su .wav, .mid, .mp3, i .au.

� Primer:

<embed src="filename.ext" width="x" height="x" autoplay="x" hidden="x" loop="x" volume="x">

</embed>

Zvuk

SRC: URL (relativna ili apsolutna putanja) do audio fajla

CONTROLS: CONSOLE tj. SMALLCONSOLE.CONSOLE definiše 144 piksela za širinu i 60 za visinu. SMALLCONSOLE definiše 144 piksela za širinu i 15 za visinu.

HEIGHT i WIDTH: Definišu veličinu prostora za objekat embed taga. Kod nekih browsera je obavezan

LOOP: Definiše koliko puta se sekvenca ponavlja. Ako se ništa ne definiše, izvršava se samo jednom

AUTOSTART : Ako je True tada se zvuk aktivira po učitavanju stranice, dok se za False vrednost mora postaviti taster kojim korisnik upravlja

Zvuk

HIDDEN: Vrednost TRUE sakriva konzolu, dok je False prikazuje.

Upotreba HIDDEN i AUTOSTART kao TRUE postiže se efekat isti kao i primenom BGSOUND.

VOLUME: Vrednost između 0 i 100 za definisanje nivoa zvuka.VOLUME: Vrednost između 0 i 100 za definisanje nivoa zvuka.

ALIGN : LEFT i RIGHT.

HSPACE i VSPACE: horizontalni odnosno vertikalni prostor oko konzole u pikselima.

Flash

� Flash objekat se može uključiti u HTML kod korišćenjem taga embed

� Kao i kod drugih objekata treba definisati putanju do objekta (sa src) dimenzije (width i heigth)

� Poželjno je postaviti kvalitet koji se očekuje (quality), tip (type) � Poželjno je postaviti kvalitet koji se očekuje (quality), tip (type) i putanju za plagin-ove (pluginspage)

Primer:

<embed src="http://pera.com/folder/1.swf" quality= "high" pluginspage="http://www.macromedia.com/go/getflashp layer" type="application/x-shockwave-flash" width="568" height="32">

</embed>

Nastaviće se...

Web dizajnDr Nenad Kojić

3. Osnove HTML-a - webdizajn.ict.edu.rs · Web dizajn Dr Nenad Koji ć . HTML - PODSEĆANJE...

Documents

Transcript of 3. Osnove HTML-a - webdizajn.ict.edu.rs · Web dizajn Dr Nenad Koji ć . HTML - PODSEĆANJE...