1. Općenito
Za unošenje texta u principu nije potreban nikakav poseban tag. Text jednostavno upisujemo u tijelo (body) dokumenta.Primjer 'Običan text': vidi code » vidi stranicu
No da li je baš sve tako jednostavno pitanje je sad amletovsko ?2. Formatiranje texta
Kako sam text ne bi bio jednoličan potrebno ga je malo uljepšati i uobličiti.Novi red postići ćemo sa break line <br>
Primjer: vidi code » vidi stranicu
Sličan ovom tagu je tag <p> koji služi za razdvajanje paragrafa. Osim što skače u novi red on još i preskače jedan red.Primjer: vidi code » vidi stranicu
Poravnanje teksta unutar paragrafa izvodi se s <p align="X"> gdje X može biti LEFT, RIGHT ili CENTER. Ovo je zastario tag pa se koristi CSS text-align: center.Primjer: vidi code » vidi stranicu
Naš browser automatski prebacuje text u novi red kada je text duži od samog prozora. Da bi poništili ovo ponašanje koristi se <nobr>.Primjer: vidi code » vidi stranicu
Ako ipak poželimo prijeći u novi red između <nobr> tagova napisat ćemo <wbr> tag. Ovo kod nekih browsera ne radi pa ćemo jednostavno tada upotrijebiti <br>.Primjer: vidi code » vidi stranicu
Ukoliko želimo umjesto znaka, slova imati prazno mjesto upotrijebit ćemo .Primjer: vidi code » vidi stranicu
Centriranje texta izvrši se sa <div align="center"> ili samo <center>.Poravnanje ulijevo nije potrebno posebno definirati jer svaki browser po defaultu ima takvo poravnanje.
Udesno se text poravnava pomoću taga <div align="right">.
Primjer: vidi code » vidi stranicu
Određeni dio texta može biti uvučen sa lijeve strane. Istodobno se dobija i efekt kao kod <p> taga. To ćemo postići ako text smjestimo između <blockquote> tagova.Primjer: vidi code » vidi stranicu
Ukoliko želimo da text u browseru bude prikazan točno onako kako smo ga napisali upotrijebit ćemo <plaintext> tag. Pri tome neće doći do interpretacije code-a odnosno HTML tagova. Ovo je vrlo korisno ako želimo prikazati HTML code u našem browseru.Primjer: vidi code » vidi stranicu
Napomena: U IE5.5 neće raditi plaintext zatvarajući tag </PLAINTEXT> pa će zbog toga plaintext djelovati do kraja HTML dokumenta. Kod Mozilla 1.2 browsera takvih problema neće biti. To je zato što je ovaj tag zastario pa umjesto njega koristite <xmp> </xmp> .
Primjer: vidi code » vidi stranicu
U ovu svrhu može se koristiti i <pre> tag s tom razlikom što dolazi do interpretacije HTML code-a. To je tzv. preformatirani text.Primjer: vidi code » vidi stranicu
3. Bold, Italic, Underline, Strike ...
Podebljani text može se ostvariti na 2 načina: <b> ili <strong>Nakošeni text takođe na 2 načina: <i> ili <em>
Podcrtani text pomoću <u>
Precrtani text sa <strike> ili <s>
Primjer: vidi code » vidi stranicu
Indexe (ab i ab) ćemo pisati pomoću <sup> i <sub> tagova.Primjer: vidi code » vidi stranicu
4. Boja texta (font color)
Kod boje texta razlikujemo:» boju običnog texta (crna ako drukčije ne definiramo TEXT atributom)
» boja linka (plava ako drukčije ne definiramo LINK atributom)
» boja posjećenog linka (definira se VLINK atributom)
» boja aktivnog linka (definira se ALINK atributom)
Svaki browser ima svoje predefinirane boje. Ukoliko želimo da naš HTML dokument određuje ponašanje browsera tada ćemo to učiniti ovako:
<body bgcolor="#989898" text="#E6EF51" link="#89FF92" vlink="#9E97FF" alink="#FF9999">
Boja texta može se promijeniti u svakom trenutku sa <font color="#8882DA">
Primjer: vidi code » vidi stranicu
5. Veličina texta (font size)
Veličina texta definira se sa npr. <font size="+3"> što je isto kao <font size=6> (vidi tablicu).U slijedećem primjeru možete vidjeti koliko veličina vaš browser podržava.
Primjer: vidi code » vidi stranicu
Najčešće je to 7 veličina koje su prikazane u tablici. Uočite da je svejedno da li ćete napisati -1 ili "-1" , ali nije svejedno "2" i 2.
1 | 2 | 3 | 4 | 5 | 6 | 7 |
"-2" | "-1" | "0" | "+1" | "+2" | "+3" | "+7" |
Takođe veličine se mogu definirati tagovima <big> odnosno <small>. Kroz slijedeći primjer vidjet ćete da ako se <big> upotrijebi više puta uzastopno da će povećavati veličinu za jedan.
Primjer: vidi code » vidi stranicu
Pri pisanju naslova koriste se heading tagovi i imaju veličine od 1 do 6 (<h1> , <h2> , <h3> , <h4> , <h5> i <h6>).Primjer: vidi code » vidi stranicu
6. Fontovi (font face)
Svaki browser ima svoje predefinirane (default) vrijednosti što se tiče veličine, boje i fonta. Te vrijednosti mogu se proizvoljno mijenjati u postavkama browsera. Web stranica kod koje nisu posebno definirana svojstva texta poprimit će svojstva koja se nalaze u postavkama browsera.Primjer: vidi code » vidi stranicu
Ukoliko striktno želimo da naša web stranica ima određeni font tada ćemo to uraditi pomoću FONT taga i njegova atributa FACE. <font face="Arial">Veoma važna stvar je da pri tome vaš browser mora podržavati dati font (u ovom slučaju Arial). No i ako ga ne bude podržavao text će biti prikazan u onom fontu koji smo definirali kao primarni u svom browseru.
Mozilla fontovi (Linux browseri)
Primjer: vidi code » vidi stranicu
Internet Explorer fontovi (Windows browser)Primjer: vidi code » vidi stranicu
Kod određenih browsera (Mozilla, Galeon) javlja se 5 vrsta fontova koje možemo proizvoljno mijenjati.
Ustvari te fontove možemo shvatiti kao nekakve font varijable, koje mogu poprimiti različite vrijednosti
stvarnih fontova. To su Serif , Sans-serif , Cursive , Fantasy i Monospace .
Ako npr. napišemo da je <font face="Fantasy"> , a Fantasy u browseru
podesimo na a.d. mono tada će text biti prikazan u a.d. mono fontu. Ako pak Fantasy podesimo na Arial
tada će text biti prikazan u Arial fontu.
Primjer: vidi code » vidi stranicu
Atribut FACE dozvoljava nam osim jednog fonta da navedemo više fontova (grupu fontova). U tom slučaju je prvi font koji napišemo primaran, a ostali su zamjenski. Npr. ako napišemo<font face="arpad , flat , Courier"> tada će naš browser prvo tražiti font arpad. Ako ga ne podržava tada će tražiti flat. Ako ni njega ne podržava onda će pokušati sa Courier. Ako međutim ne podržava niti jedan od ova tri navedena fonta onda će browser za prikaz texta upotrijebiti font u njegovim postavkama koji smo definirali kao predefinirani (default font). Ovo je osnovna logika po kojoj rade svi browseri prilikom traženja fonta.
Primjer: vidi code » vidi stranicu
Vrlo je zanimljiv font fixne dužine. Kod njega svako slovo zauzima istu količinu horizontalnog prostora. To postižemo sa <tt> Typewriter Tagom.Primjer: vidi code » vidi stranicu
7. Osnovni font (basefont)
Vjerojatno ste se pitali kako definirati osnovne postavke za text koje će se odnositi na cijeli text unutar naše web stranice. Rješenje je u <basefont> tagu.Sintaxa mu glasi :
<basefont face="serif,Arial,Courier" size="2" color="#FF0000"
Primjer: vidi code » vidi stranicu
Ovaj tag je poprilično zastario pa ga Mozilla 1.2 ne podržava. U tom slučaju morat ćete koristiti samo <font> ili CSS, no o CSS-u kasnije. IE5.5 podržava ovaj tag.
8. Specijalni znakovi u HTML -u
Ponekad će vam u životu zatrebati da napišete npr. < , > , µ ... itd. Slijedeće tablice prikazuje većinu specijalnih znakova (engl. & ampersand characters).Primjer: vidi code » vidi tablicu
Svaki znak može se napisati tako da se upotrijebi &#nnn gdje je nnn broj ASCII koda.Primjer: vidi code » vidi tablicu
Provjeru možete izvršiti pomoću posebnog programa : Symbol translator9. Komentar u HTML code -u
Radi boljeg pregleda HTML coda te radi objašnjenja što pojedini dio HTML dokumenta
predstavlja napisat ćemo komentar. Komentar neće biti prikazan u prozoru našeg browsera,
nego ćemo ga vidjeti tek kad pogledamo source code.
<!-- Ovo je komentar. -->
10. Buduće odrednice
Može se primjetiti kako većina ovih tagova je zastarjela te ih neki browseri više ne podržavaju (npr. basefont , wbr , blink ...). To ne znači da se više ne mogu postići ovi efekti. Jednostavno se po preporukama W3C-a danas više koristi CSS koji je mnogo flexibilniji i bogatiji. Zato će u budućnosti CSS sve više zamjenjivati zastarjele HTML tagove te će se razvoj ovog jezika vjerojatno kretati u ovom pravcu.I evo jednog primjera gdje je za pozadinu upotrijebljena animirana GIF sličica.
Primjer: vidi code » vidi stranicu