Увод у ХТМЛ Лекција 2

HTML – FORMATIRANJE TEKSTA
Ako se drugačije ne naglasi tekst unutar HTML stranice je poravnat uz levu stranu. Ako se želi
da naslov, ili bilo koji drugi element stranice, bude centriran, treba ga staviti izmedju tagova
<center> i </center> što će dati sledeći rezultat:
OVO JE CENTRIRAN TEKST
izvršavanjem sledećeg koda
<center> OVO JE CENTRIRAN TEKST </center>
Ukoliko se posebno ne naglasi kojim fontom se želi da bude ispisan tekst na stranici, browser
će koristiti default font (a to je obično Times New Roman). Rad sa fontovima u okviru HTML
stranice se obavlja pomoću taga. Ovaj tag može imati sledeće atribute: face, size i color.
Atributom face definišemo tip fonta kojim se želi da tekst bude ispisan. Na jednoj stranici se
može koristiti i više različitih fontova. Ako se želi da stranica bude ispisana na primer "Comic
Sans MS" fontom onda treba navesti sledeći kod:
 Ovde se nalazi tekst. 
i dobija se rezultat
Ovde se nalazi tekst.
Ako se koriste neki fontovi koji se retko koriste onda bi bilo dobro navesti i nekoliko
alternativnih fontova, jedan za drugim, odvojenih zarezom.

Evo primera nekoliko popularnih fontova koji se mogu koristiti na svojim stranicama:
Verdana
Arial
Courier New
Times New Roman
Comic Sans MS
Kod je sledeći:
<center>
Verdana 
Arial 
Courier 
Bedrock 
Times New Roman 
Comic Sans MS
</center>
Pored načina ispisivanja teksta, u okviru stranice može se upravljati i veličinom slova. Za ove
potrebe koristi se size atribut unutar font taga. HTML razlikuje 7 veličina slova koje nose
vrednosti od 1 do 7. Podrazumevana veličina je 3.
Razmera slova je data:
size 1, size 2, size 3, size 4, size 5, size 6, size 7.
Prikaz u browser-u: Kod napisan u Notpad-u:
Poslednja osobina koja se može menjati je boja slova u okviru HTML stranice. Za te potrebe
koristi se atribut color font taga. Za ovaj atribut važi isto pravilo kao i kod definisanja boja
<body> tagom. Dakle, ako želimo da prikažemo sledeći tekst ispisan crvenom bojom:
Ovde se nalazi tekst prikazan crvenom bojom.
Pomoću sledećeg dela koda:

Ovde se nalazi tekst prikazan crvenom bojom.
ili
Ovde se nalazi tekst prikazan crvenom bojom.
Izgled u browser-u:
Kao što možemo da primetimo u kodu, boje u HTML-u se mogu predstaviti kodnim zapisom
boje ili engleskim nazivom – prikaz će biti isti. Medjutim, nazive na engleskom za mnoge
nijanse boja treba imati u nekoj tablici, jer je nemoguće znati ih napamet, a isto tako i kodove
boja. Postoji standardizovana tablica za boje i nijanse boja od 124 različitih (Prikaz na kraju
lekcije).
Pored taga HTML poseduje još mogućnosti za obradu teksta. U HTML dokumentima
postoji mogućnost pisanja podebljanim (bold ili strong) slovima i kurzivom (italic), kao i
mogućnost podvlačenja (underline) i precrtavanja (strike) teksta. Sledeća tabela prikazuje
odgovarajuće tagove kao i rezultate njihove primene:
Tekst se u browseru automatski lomi na kraju reda. Da bi se postiglo da neki deo teksta bude
u jednom redu, treba umetnuti taj deo teksta između tagova: ovde ide vas tekst koji se nece
prelomiti na kraju reda - i dobija se pomoću sledećeg dela koda:
 ovde ide vaš tekst koji se neće prelomiti na kraju reda 
 - No Break
Ukoliko je tekst prevelik da stane u jedan red u okviru ekrana, na dnu prozora će se pojaviti
horizontalni "scrollbar" i korisnik će morati da skroluje da bi ga pročitao. Zato treba biti
obazriv sa korišćenjem ovog taga. Ukoliko se želi da se red prelomi, ali na tačno određenom
mestu, to se može postići korišćenjem taga. Ovaj tag ne zahteva završni tag. Za razliku
od taga koji će obavezno prelomiti red, ovaj tag će prelomiti red samo ako je to
neophodno tj. ako je tekst pre njega predugačak da bi stao u jedan red. Ovaj tag takođe
omogućava da se prelomi neka dugačka reč na kraju reda. Kada se koristi bilo koji tekst editor
prelazak u novi red se postiže pritiskom na taster ENTER (ili RETURN). Ali ako se isti princip
koristi i pri pisanju HTML stranice neće se dobiti isti rezultat. Naime, da bi browser prikazao
novi red, to se mora eksplicitno navesti odgovarajućim tagom.
Tag za prelazak u novi red je tag. On ne zahteva odgovarajući završni tag. Prelazak u
novi pasus se postiže tagom. On ima isto dejstvo kao i prethodni tag s tom razlikom što će
napraviti mali razmak između redova. Na kraju pasusa se može staviti i njegov završni tag, ali
većina browser-a ga ne zahteva, tako da se slobodno može i izostaviti.
Tekst se, ako se ništa ne navede, poravnava uz levu marginu. Centriranje pasusa ili
poravnanje pasusa uz desnu marginu se postiže align atributom. Align atribut može imati tri
vrednosti:
Levo
Centar
Desno
Kod koji prikazuje gornji primer je:
Levo Centar Desno
Dakle, Odgovarajući tagovi za svako od navedenih poravnanja treba da izgledaju ovako:




Ako se želi da se prelazak na neku novu celinu još više naglasi koristi se horizontalna linija
pomoću sledećeg taga:
<HR SIZE=4 WIDTH="50%">
Dobija se sledeći rezultat:
________________________________________
Liniju se povlači pomoću <hr> taga.

Ovaj tag crta tanku sivu liniju preko cele stranice. I ovaj tag može sadržati odgovarajuće
atribute kojima možete regulisati izgled linije. Ako se ne želi da linija bude zasenčena, već
potpuno crna potrebno je koristiti atribut noshade. Ako se želi promeniti dimenzije linije,
koriste se sledeća dva atributa: size i width. Atributom size odredjuje se debljina linije u
pikselima, a atributom width odredjuje se dužina linije ili u pikselima ili u procentima širine
stranice. Ovaj tag takođe može sadržati align atribut kome se može dodeliti ista vrednosti kao
i za pasus. Boja linije se može regulisati pomoću color atributa na već opisani način. Na
primer, ako želimo da nacrtamo nezasenčenu crvenu liniju koja će biti centrirana i čija će
debljina iznositi 6 piksela, a protezaće se preko 50% širine stranice, potrebno je uneti sledeći
kod:
<hr noshade align="center" size="6" width="50%" color="#ff0000">
Tako će se dobiti sledeća linija:
U tekst editorima dugme "TAB" (engl. indent) služi za prikazivanje odredjenog broja praznih
mesta. Ali pri pisanju HTML koda iako se u samom kodu prikazuje dejstvo taba, pri
prikazivanju stranice to će biti bez ikakvog efekta. I u HTML dokumentu se može napraviti
prazno mesto pomoću oznake &nbsp. Ova oznaka ostavlja jedno prazno mesto.
Ako se želi pet praznih mesta jednostavno se napiše pet ovakvih oznaka jednu za drugom
odvojenih tačkom-zarezom:

Odgovarajući HTML kod izgleda ovako:

xxxx xxxx xxxx xxxx xxxx xxxx xxxx xxxxx xxxx xxxxx
xxxx xxxxx x xxxxx x xxxxxx xxx xxxx xx xxxxx xx x xxxxx xxxxxx xx xxxxxxx x x xxxxxxxx
xxxx xxxxxx xxxxx xxxx xxxxxx xxxxxxxxxxxxx xxx xxxx xx xxxxxxx x x xxxxxxxxxxxx xxxxx.
Prikaz je:
xxxx xxxx xxxx xxxx xxxx xxxx xxxx xxxxx xxxx xxxxx xxxx xxxxx x xxxxx x xxxxxx xxx
xxxx xx xxxxx xx x xxxxx xxxxxx xx xxxxxxx x x xxxxxxxx xxxx xxxxxx xxxxx xxxx xxxxxx
xxxxxxxxxxxxx xxx xxxx xx xxxxxxx x x xxxxxxxxxxxx xxxxx.
Pored ove oznake mogu se koristiti i sledeće (u tabeli prva kolona označava HTML oznaku, a
druga rezultat koji se dobija u okviru HTML strane):
Primeri za vežbu
Primer 1. Rad sa fontovima.
<html>
<head>
<title> Rad sa fontovima</title>
</head>
<body>
 The 
<A HREF="library.html">library</A> 
has an arrangement with the

<A HREF="cafeteria.html">cafeteria</A>
 to provide refreshments during the weekly

<A HREF="coffeehouse.html">coffee house</A>
 lectures.

</body>
</html>
Primer 2. Rad sa prelomom linije.
<html>
<head>
<title> Rad sa prelomom linije </title>
</head>
<body>

<h1> Come Scroll with me, away to the right, as I list out all of the long answers to the
meaning of life accessible only to those that can scroll, scroll, scroll...</h1>

</body>
</html>
Tablica standardnih boja i nijansi

Увод у ХТМЛ Лекција 2

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Увод у ХТМЛ Лекција 2

Uploaded by

Copyright:

Available Formats

HTML – FORMATIRANJE TEKSTA

OVO JE CENTRIRAN TEKST

izvršavanjem sledećeg koda

<center> OVO JE CENTRIRAN TEKST </center>

Pomoću sledećeg dela koda:

Dakle, Odgovarajući tagovi za svako od navedenih poravnanja treba da izgledaju ovako:

Liniju se povlači pomoću <hr> taga.

Primer 1. Rad sa fontovima.

Primer 2. Rad sa prelomom linije.

You might also like