Uredjenje teksta

U prethodnom naslovu videli smo kako se može formatirati tekst u smislu njegove boje, veličine, fontovi, iskošenje itd. Ovde ćemo videti kako možemo uredjivati tekst u smislu novih redova, pasusa, uredjivati u prostoru i tako dalje.

<BODY> brzo shvatam HTML </BODY>

Uredjenje teksta slika 1

Znači u samom kodu hteli smo da svaka reč bude u novom redu, medjutim brauzer to nije ispoštovao i sve je ispisao u jednom redu. Dakle, da bi brauzer razumeo da hoćemo nešto napisati u novom redu moramo mu to "objasniti" tagom. Tag za novi red je <br>, pa da vidimo:

<BODY> brzo<br> shvatam<br> HTML </BODY>

Uredjenje teksta slika 2

Do istog rezultata u brauzeru bi smo došli da smo napisali kod i ovako:

<BODY> brzo<br>shvatam<br>HTML </BODY>

A možemo ako je potrebno i više puta zaredom stavljati oznaku za novi red, na primer A<br><br><br>B. U ovom slučaju ispisaće se slovo A pa tek nakon tri reda ispod i slovo B.

Ako želimo novi red, i pri tome da uredimo i tekst u smislu da bude poravnjan i u desnu stranu (kao tekst u novinama), ili da tekst bude centriran, ili na levoj strani ili desnoj onda koristimo tag DIV:

<BODY> brzo <div> shvatam HTML jer nije nimalo tezak </div> </BODY>

Uredjenje teksta slika 3

Znači kad je tag DIV bez atributa imamo isti efekat kao da smo koristili i tag <br>. Medjutim poenta korišćenja DIV taga je u njegovim atributima, pa da vidimo:

<BODY> brzo <div align=center> shvatam HTML jer nije nimalo tezak </div> <div align=left> shvatam HTML jer nije nimalo tezak </div> <div align=right> shvatam HTML jer nije nimalo tezak </div> </BODY>

Uredjenje teksta slika 4

Atribut ALIGN=CENTER centrira tekst na sredinu prostora, ALIGN=LEFT pomera tekst krajnje levo (to imamo i bez atributa), i ALIGN=RIGHT pomera tekst krajnje desno.

Postoji još jedan vrlo zanimljiv atribut koji se zapisujeALIGN=JUSTIFY. Kada pogledate primer sve će biti jasno:

<BODY> Ovo je malo duzi tekst da bi se moglo objasniti upotreba jednog vrlo zanimljivog atributa za uredjivanje teksta. Nas tekst sa tim etributom izgleda jako profesionalno i lepo. Zato je preporuka da se on koristi uvek kad se pisu tekstovi. Evo upravo ovi redovi demonstriraju i dokazuju to. <div align=justify> Ovo je malo duzi tekst da bi se moglo objasniti upotreba jednog vrlo zanimljivog atributa za uredjivanje teksta. Nas tekst sa tim etributom izgleda jako profesionalno i lepo. Zato je preporuka da se on koristi uvek kad se pisu tekstovi. Evo upravo ovi redovi demonstriraju i dokazuju to. </div> </BODY>

Uredjenje teksta slika 5

Kao što vidimo prvi tekst je napisan bez ikakvih tagova a drugi sa DIV tagom u kome je napisan i atribut. Primećujete kako je tekst sa atributom na desnoj strani lepo poravnjan kao neki profesionalan novinarski članak.

Korišćenjem <br> i <div> taga tekst pisan nakon tih tagova se premešta u novi red. Postoji još jedan tag<p></p> koji tekst spusta direktno dva reda niže, i tako pravi novi pasus. Naravno takav efekat imamo ako stavimo <br><br>, ali <p> tag može da sadrži i sve atribute kao i <div> tag. Da ne bi se ponavljao uzeću za objašnjenje zadnji primer <div> taga samo ću zameniti umesto<div align=justify></div> staviću<p align=justify></p>. Naravno i ostali primeri su isti stim što se rezultat razlikuje jer pomera dva reda niže <p> tag.

<BODY> Ovo je malo duzi tekst da bi se moglo objasniti upotreba jednog vrlo zanimljivog atributa za uredjivanje teksta. Nas tekst sa tim etributom izgleda jako profesionalno i lepo. Zato je preporuka da se on koristi uvek kad se pisu tekstovi. Evo upravo ovi redovi demonstriraju i dokazuju to. <p align=justify> Ovo je malo duzi tekst da bi se moglo objasniti upotreba jednog vrlo zanimljivog atributa za uredjivanje teksta. Nas tekst sa tim etributom izgleda jako profesionalno i lepo. Zato je preporuka da se on koristi uvek kad se pisu tekstovi. Evo upravo ovi redovi demonstriraju i dokazuju to. </p> </BODY>

Uredjenje teksta slika 6

Vidite kako je <p> tag napravio novi pasus, preskočio jedan red. Ovde treba napomenuti da svi ovi tagovi <br>, <div> i <p> mogu se koristiti, i imaju iste efekte, i na HTML objekte kao što su tabele, multimedija, slike i tako dalje, a ne samo na tekst. To isto važi i za naredne tagove koje ćemo do kraja ovog naslova videti. I još nešto, ako želimo da centriramo neki tekst na sredini prostora možemo koristiti i tag <center></center>. Ostali kao što su left, right i justify nemaju takav tag.

Da bi bio siguran da vam je sve jasno daću prethodni primer sa dodatkom tagova iz prethodnog naslova, kako bi ste videli da možete pustiti mašti na volju u kombinovanju HTML tagova pri izgradnji web stranica.

<BODY> Ovo je malo duzi tekst da bi se moglo objasniti upotreba jednog vrlo zanimljivog atributa za uredjivanje teksta.<FONT SIZE=5 color=#CC33FF> Nas tekst sa tim etributom izgleda jako profesionalno i lepo</font>. Zato je preporuka da se on koristi uvek kad se pisu tekstovi. Evo upravo ovi redovi demonstriraju i dokazuju to. <p align=justify> Ovo je malo duzi tekst da bi se moglo objasniti upotreba jednog vrlo <font color=#FF0000 face="verdana" SIZE=1><b>zanimljivog atributa za uredjivanje teksta</b></font>. Nas tekst sa tim etributom izgleda jako profesionalno i lepo. Zato je preporuka da se on koristi uvek kad se pisu tekstovi. Evo upravo ovi redovi demonstriraju i dokazuju to. </p> </BODY>

Uredjenje teksta slika 7

Idemo dalje. Hajde sad da napišemo rečenicu u kojoj su reči prilično razmaknute izmedju sebe:

<BODY> brzo shvatam HTML </BODY>

Rezultat biće:

Uredjenje teksta slika 8

Dakle iako smo mi u kodu napisali tekst sa više razmaka brauzer je ipak sve prikazao sa jednim razmakom. Znači i ovde moramo nekako reći brauzeru kroz kod da piše više od jedne razmaknice. Za pisanje razmaknice se ne koristi nikakav tag već šifra  

<BODY> brzo        shvatam        HTML </BODY>

Uredjenje teksta slika 9

Znak " &" označava početak šifre, a znak " ; " kraj.Pored ove šifre za razmaknicu postoje šifre za sve moguće znakove i slova. Za razmaknicu je neophodno uvek koristiti šifru, a za neke znakove je po nekad potrebno koristiti njihovu šifru. Na primer svaki tag počinje znakom " < " a završava se " > ". I sad kad bi se ti znakovi koristili unutar koda i za njihovo prikazivanje u brauzer, tada bi u nekim slučajevima došlo do greške jer bi ih brauzer razumeo u nekim slučajevima kao sintaksu za pisanje tagova. Da do toga ne bi došlo ti znakovi ( a i ostali kao što je na primer znak dvostruki navodnici " " " ) moraju se po nekad napisati u obliku šifre. Takodje ne moramo koristiti one meta tagove za definisanje srpskih slova koji smo na početku napisali, već i naša slova imaju šifre. I jedna vrlo bitna napomena. Za pisanje šifri obavezno koristite samo mala slova. Evo tabele interesantnih HTML šifri:

Šifra1	Znak1	Šifra2	Znak2	Šifra3	Znak3	Šifra4	Znak4
č	č	±	±	²	˛	¼	Ľ
Č	Č	&	&	³	ł	½	˝
ć	ć	<	<	ˆ		¾	ľ
Ć	Ć	®	®	µ	µ
đ	đ	>	>	¶	¶	÷	÷
Ð	Đ	"	"	Ø	Ř	ß	ß
š	š	€	€	×	×	™	™
Š	Š	‰	‰	¹	ą	•	•
ž	ž	©	©	§	§	¢	˘
Ž	Ž	£	Ł	¥	Ą	ƒ

Postoje preko 40 000 šifri (ASCII-HEX vrednosi) za raznorazne znakove. Kliknite na sledeće dugme da vifite većinu interesantnih šifri:

Da nastavimo sa novim stvarima. Primetili ste da tekst koji pišete u HTML kodu i tekst koji prikazuje brauzer se dosta razlikuje. Na primer vi možete u kod-u pisati tekst u jednom redu jako dugo, a kad brauzer prikaže taj tekst on ga saseče u nekoliko redova tako da se smesti baš u prostor po horizontali kolika je horizontalna dužina ekrana. Medjutim postoji tag koji nedozvoljava da brauzer saseče vaš tekst bez obzira koliko je dug. Naime, neće smeti da ga iseče već će napraviti horizontalni klizač tako da se ceo tekst može isčitati. Tag koji radi to je <nobr></nobr> a izmedju početnog i krajnjeg taga NOBR smeštate tekst koji ne želite da sečete u više redova.

Tag <BLOCKQUOTE></BLOCKQUOTE> pravi margine sa leve strane čitavom tekstu koji je u njemu (sve redove pomera par razmaka udesno). Evo primera:

<BODY> <BLOCKQUOTE> Ovo je malo duzi tekst da bi se moglo objasniti upotreba jednog vrlo zanimljivog atributa za uredjivanje teksta. Nas tekst sa tim etributom izgleda jako profesionalno i lepo. Zato je preporuka da se on koristi uvek kad se pisu tekstovi. Evo upravo ovi redovi demonstriraju i dokazuju to. </BLOCKQUOTE> </BODY>

A rezultat:

Uredjenje teksta slika 10

Već nekoliko puta smo pisali u ovom delu kako brauzer ne prikazuje tekst onako kako ga mi napišemo u kod-u ako ne primenjujemo tagove. Medjutim postoji tag koji omogućava da brauzer prikaže naš tekst baš onako kako ga mi napišemo u kod-u. Taj tag je <pre></pre>. Evo primera koji jasno dočarava sve:

<BODY> _ _ (o)--(o) /.______. ________/ ./ . ( . , ) _\//_/ / ~~ ~~ ~~ <BODY>

Ako samo ovako napišemo brauzer će dati sledeći prikaz:

Uredjenje teksta slika 11

A ako napišemo ovako:

<BODY> <PRE> _ _ (o)--(o) /.______. ________/ ./ . ( . , ) _\//_/ / ~~ ~~ ~~ </PRE> <BODY>

Rezultat će sad biti:

Uredjenje teksta slika 12

I na kraju ovog dela možemo opisati tag koji služi za komentar unutar HTML kod-a. Kada pišete neki HTML kod koji je jako veliki potrebno prokomentarisati neke njegove delove, kako bi se kasnije lakše snašli kad trebate nešto da dodate ili ispravite. Tag za komentar počinje . Sve unutar tog taga brauzer preskače i ignoriše. Znači tu možete da pišete šta god želite, čak i bilo koje tagove itd, sve će biti ignorisano.