HTML predavanje
Autor: Dušan Zenit



Prvo predavanje
Drugo predavanje
Treće predavanje
Četverto predavanje
Peto predavanje
Tagovi
Formular predavanje

Ako ne znate baš ništa o tome kako se rade web stranice,
onda prvo trebate naučiti HTML.

Neka vam za početak jedini alat bude obični NOTEPAD u kome ćete napisati svoje prve html tagove.Tek nakon što naučite rukom pisati osnove HTML-a, tek onda prjeđite na Dreamweaver koji će html onda pisati umjesto vas, a vi će te samo nadgledati...

Dakle, počinje se pisanjem "rukom"... Pa počnimo:

Da biste počeli sa dizajniranjem web stranice morate ići redosljedom, a to je da na početku svake stranice stavite
<html><head>
<title>Naziv vaše stranice </title></head>
<body background>="URL adresa slike za pozadinu vaše stranice">
Html tag znači početak HTML stranice, head tag znači da ovdje možete staviti title od svoje stranice koja će se moći vidjeti ako stranicu unesete u internet pretrazivače i title vaše stranice moći će se vidjeti kada je unesete u bookmarks ili favorits.U head tag mozete staviti još neke stvari ali o tome ćemo poslije. U "body" tag-u ćete stavljati sve stvari koje ste naumili da vaša stranica sadrži: slike, tekstove i ostale stvari, i na kraju vaše stranice kada postavite sve što ste htjeli morate stranicu završiti sa završnim tagovima </body></html>

Svi tagovi uvijek moraju biti zatvoreni.

Prvi tag koji sam ja naučio je bio <center>
Taj se "tag" koristi za centriranje teksta, slike ili nečega sredinu stranice. To bi izgledalo ovako:

ovaj tag koristim za centriranje


Taj efekat sam izveo na ovaj način:
<center>ovaj tag koristim za centriranje</center>

Kao sto vidite vrlo je jednostavno,naravno u pocetku je malo zbunjujuce i zato zapisite sebi u svesku dok ne zapamtite kasnije.
</center>ovaj tag sam koristio kao zavrsnicu centriranja jer ako ga ne stavite na kraju onda ce vam cijela stranica biti centrirana na sami centar.Imacete ispocetka greski ali i sami znate da se na greskama uci,naravno necete pokvariti sa time kompjuter ali cete uvidjeti da morate uraditi sve bez i jedne greske kako bi sve izgledalo onako kako ste zamislili. Sledeci tag je <b> koji se zavrsava sa </b> ovaj tag se koristi za podebljivanje teksta tako da tekst bude naznacen,taj tag bi izgledao ovako:

Ovaj tag koristim da bi naznacio tekst

To smo uradili ovako <b>Ovaj tag koristim da bi naznacio tekst</b>

Postoji tag slican ovome koji se zove italic a tag je <i> i za ovaj tag koristite </i> na zavrsetku teksta.
Italic se moze kombinirati sa ovim gore,u stvari svi se skoro tag-ovi mogu kombinirati jedan sa drugim.Italic bi koristili ovako:

Ovaj tag koristim da bi naznacio tekst na drugaciji nacin

Naravno to smo izveli ovako <i> Ovaj tag koristim da bi naznacio tekst na drugaciji nacin</i>

Kombinacijom ova tri tag-a koja smo naucili do sada,tekst bi izgledao

Pretezno se svi tag-ovi u HTML mogu kombinirati

Da sumiramo to je izvedeno ovako <center> <b><i>Pretezno se svi tag-ovi u HTML mogu kombinirati</i></b></center>

Kako mijenjati boje teksta? Jednostavno
To ide ovako <font color=?> ovaj tag se zavrsava sa </font>
Stavio sam upitnik na mjesto gdje treba doci HTML broj specificne boje koju zelite da koristite. Ovaj tag bi koristili na sljedeci nacin

Ovo je plava bojaOvo je crvenaA ovo je boja masline

Kako smo ovo izveli i koji smo broj koristili da bismo dobili navedene boje?Pogledajte
<font color=0000ff>Ovo je plava boja</font><font color=red>Ovo je crvena</font><font color=808000>A ovo je boja masline</font>

Pored ovih primjera mozete koristiti naravno i druge brojeve za boje,na primjer
0000FF Plava
FFFFFF Bijela
FFFF00 Zuta
000000 Crna
8a2be2 Ljubicasta
00008b Tamno plava
006400 Zelena
e6e6fa Plava nijansa
191970 Plavicasto crna
808000 Maslina
ff4500 Narandzasta
6a5acd Plavicasto siva
708090 Tamno siva
008080 Tamno zelena
HTML tags mozete pisati sa velikim ili malim slovima,to uopste nije vazno.

Mozete kontrolisati i velicinu teksta,vrlo jednostavno i necu vas gnjaviti sa komplikovanim siframa nego cemo pokusati na najlaksi nacin
Osnovni tagovi su
<h1> </h1>
<h2> </h2>
<h3> </h3>
<h4> </h4>
<h5> </h5>
<h6> </h6>

Oni bi izgledali ovako

Ovo je najveci tekst


Ovo je veliki tekst


Ovo je normalana velicina teksta


Ovo je malo manji tekst


Jos malo manji tekst

I na kraju ovo je najmanji tekst

To smo izveli na ovaj nacin
<h1>Ovo je najveci tekst</h1><br>
<h2>Ovo je veliki tekst</h2><br>
<h3>Ovo je normalna velicina teksta</h3><br>
<h4>Ovo je malo manji tekst</h4><br>
<h5>Jos malo manji tekst</h5><br>
<h6>I na kraju ovo je najmanji tekst</h6><br>

Ovo su najlaksi tagovi za kontrolisanje velicine teksta,ima ih jos ali su malo komplikovaniji i zato necu da vas zbunjujem sa time za sada. Ovo je najlakse i najprakticnije.
Kao sto ste mogli primjetiti,koristio sam tag <br> za razdvajanje teksta i za pocetak novog reda. <br> se moze koristiti i za razdvajanje vecih tekstova i koliko ga puta stavite izmedju nekih tekstova ili rijeci toliko ce veliki biti razmak.
Osim ovog taga mozete koristiti i <p> ovaj tag se iskljucivo koristi za razvajanje teksta i pocinje novi red ali ga ujedno i razdvaja. Eksperimentisite sa time pa cete naci nacin na koji vama odgovara.
Razdvajanje teksta mozete vrsiti i sa tagom <hr> on stvara horizontalnu liniju izmedju tekstova. Najcesce se koristi da bi se naznacilo razdvajanje a i mozete ga koristiti i u druge svrhe.

Na primjer






To smo izveli na sljedeci nacin
<hr><br>
<hr width=59><br>
<hr width=105><br>
<hr width=200><br>
<hr width=250><br>

Vrlo jednostavan tag.<br> smo koristili ponovo za pocetak novog reda. Ako zelite da pisete neki duzi tekst,pricu ili nesto slicno tome ona koristite <blockquote>
Taj se tag stavlja na pocetak teksta a zavrsava se sa </blockquote>
Da vidimo kako izgleda

Pocetkom Juna '98 pocinje svjetsko prvenstvo u nogometu.
Ja cu navijati za Hrvatsku i Jugoslaviju
Nalazim se u Americi i bicu u stanju da gledam sve utakmice u direktnom prenosu.Ne znam kakvo je stanje u Hrvatskoj i Jugoslaviji i da li ce oni moci gledati sve utakmice ili samo nekoliko utakmica zbog toga sto je direktan prenos vrlo skup.

Ne znam da li ce se dobro plasirati,jer u igri ima i mnogo srece a naravno i znanja.Jedino mi je krivo sto se i reprezentacija Bosne nije plasirala.



Toliko o tome,nadam se da cete i vi uzivati u utakmicama i da cete nauciti nesto HTML tako da bude jos vise nasih stranica na Internetu

To smo izveli na ovaj nacin

<blockquote> Pocetkom Juna '98 pocinje svjetsko prvenstvo u nogometu.<br>
Ja cu navijati za <b>Hrvatsku</b> i <b>Jugoslaviju</b><br>
Nalazim se u Americi i bicu u stanju da gledam sve utakmice u direktnom prenosu.Ne znam kakvo je stanje u Hrvatskoj i Jugoslaviji i da li ce oni moci gledati sve utakmice ili samo nekoliko utakmica zbog toga sto je direktan prenos vrlo skup.<p>

Ne znam da li ce se dobro plasirati,jer u igri ima i mnogo srece a naravno i znanja.Jedino mi je krivo sto se i reprezentacija <b>Bosne</b>nije plasirala.
<br>
<br>
<hr width=350> <br>
<br>
<font color=0000ff>Toliko o tome,nadam se da cete i vi uzivati u utakmicama i da cete nauciti nesto HTML tako da bude jos vise nasih stranica na <i>Internetu</i></font>
</blockquote>

Toliko o tome.A sada vidimo kako se upravlja tekstom.Mozete ga staviti da ide na centar,desnu i lijevu stranu.
Tag koji bi zato koristili je
<p align=center>
<p align=right>
<p align=left>

Ovaj tekst ce se nalaziti na desnoj strani

Ovaj tekst ce se nalaziti na lijevoj strani

Ovaj tekst ce se nalaziti na sredini stranice

To smo izveli na ovaj nacin
<p align=right>Ovaj tekst ce se nalaziti na desnoj strani<p>
<p align=left>Ovaj tekst ce se nalaziti na lijevoj strani<p>
<p align=center>Ovaj tekst ce se nalaziti na sredini stranice<p>
<p> smo koristili za razdvajanje teksta kao sto ste vidjeli.

Naravno necete moci sve nauciti napamet ove tagove zato zapisite ih u svesku tako da vam budu pri ruci kada bude dizajnirali svoju home page stranicu.
Sledeci tag koji cemo nauciti je <pre>
Taj se tag koristi kada zelite da stranica izgleda bas onako kako ste je napisali.Na primjer mozete je koristiti na razne nacine,sve zavisi do vas. Pogledajte primjer

Mogu      pisati tekst          kako god
     i tako           ce i izaci



na stranici koju                         ja budem 
                       dizajnirao.

Ovaj efekat smo izveli na sljedeci nacin
<pre>

Mogu      pisati tekst          kako god
     i tako           ce i izaci



na stranici koju                         ja budem 
                       dizajnirao.
</pre>

Nije lose ponekad iskoristiti,sve zavisi do vas.

Sledeci tag je <!--vas komentar-->
Da vidimo kako izgleda u upotrebi.

Kao sto vidite prazno,nista,ali tu se ipak nalazi tekst-komentar. Pa da vam pokazem kako je ovo izvedeno jer samo ja znam sta je napisano u komentaru.

<!--Ovdje mogu pisati sta god hocu a posjetioci nece moci vidjeti nego samo ja mogu.Ovaj tag mi koristi da kada pravim stranicu mogu upisati svoje komentare tako da se mogu podsjetiti u vezi necega vaznog tako da ne bi ih zabrljao stranicu. -->

Jos jedan tag koji cu vam pokazati je <strong> i </strong>
Ovaj tag ima istu funkciju kao i bold <b> tako da mozete da birate koji cete da koristite.

Evo jedan zanimljiv tag <strike>
Njega bi koristili na sledeci nacin

Zlobodan Sljivosevic , Aljo Izmetbegovic , Sranjo Tudzmanovic

Izveli smo na ovaj nacin
<strike>Zlobodan Sljivosevic , Aljo Izmetbegovic , Sranjo Tudzmanovic </strike>

Prvo predavanje
Drugo predavanje
Treće predavanje
Četverto predavanje
Peto predavanje
Tagovi
Formular predavanje

Nastavak


RVD <LUUN::DESIGN> 1998