1 / 28

Formatiranje teksta

Formatiranje teksta. s tavimo neki naslov na Web stranicu (npr. "ALFA ROMEO ").  HTML razlikuje šest nivoa (veličina) naslova, a sledeća tab ela prikazuje svih 6 tagova i odgovarajuće naslove : <h1>ALFA ROMEO</h1> ALFA ROMEO <h2>ALFA ROMEO</h2> ALFA ROMEO <h3>ALFA ROMEO</h3> ALFA ROMEO

ling
Download Presentation

Formatiranje teksta

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Formatiranje teksta • stavimo neki naslov na Web stranicu (npr. "ALFA ROMEO"). HTML razlikuje šest nivoa (veličina) naslova, a sledeća tabela prikazuje svih 6 tagova i odgovarajuće naslove: <h1>ALFA ROMEO</h1>ALFA ROMEO <h2>ALFA ROMEO</h2>ALFA ROMEO <h3>ALFA ROMEO</h3>ALFA ROMEO <h4>ALFA ROMEO</h4>ALFA ROMEO <h5>ALFA ROMEO</h5>ALFA ROMEO <h6>ALFA ROMEO</h6>ALFA ROMEO

  2. Formatiranje teksta • po defaultu tekst je poravnat uz levu marginu. Ako želimo da naš naslov, ili bilo koji drugi element stranice, bude centriran, treba ga staviti između tagova <center> i </center>: <center>OVO JE CENTRIRAN TEKST</center> što daje slede: OVO JE CENTRIRAN TEKST

  3. Formatiranje teksta • ukoliko posebno ne naglasimo kojim fontom želimo da bude ispisan tekst na našoj stranici, browser će koristiti default font • osnovni tag kojim menjamo font na HTML stranici je <font> a on može imati tri atributa: face, size i color.

  4. Formatiranje teksta • atributom face definisan je tip fonta kojim želimo da naš tekst bude ispisan. • na jednoj stranici možemo koristiti i više različitih fontova. • pri tom treba voditi računa o tome da korisnik koji učitava našu stranicu mora imati instaliran taj font na svom računaru. • u suprotnom njegov browser će prikazati tekst u default fontu. Zato na svojim stranicama ne treba koristiti neke egzotične fontove, već koristiti samo široko rasprostranjene fontove.

  5. Formatiranje teksta • ako hoćemo da naša stranica bude ispisana recimo “Verdana" fontom onda pišemo: <font face=“Verdana"> ovde pišemo tekst. </font>

  6. Formatiranje teksta • ako koristimo neke egzotičnije fontove onda bi trebalo navesti i nekoliko alternativnih fontova, jedan za drugim, odvojenih zarezom. • ako posetilac naše stranice na svom računaru nema instaliran prvi font sa liste, on će ga prikazati u sledećem sa liste, i tako dalje. • na primer: <font face="Comic Sans MS,Arial,Courier">

  7. Formatiranje teksta • primer nekoliko popularnih fontova koji se mogu koristiti na web stranicama: VerdanaArialCourierBedrockTimes New RomanComic Sans MS

  8. Formatiranje teksta • može se menjati i veličina slova, a ona se definiše preko size atributa. • HTML razlikuje 7 veličina slova kojaimaju vrednosti od 1 do 7 • podrazumevana (default) veličina je 3. • ako su nam slova veličine 3 suviše mala možemo zadati veličinu slova 5: <font size="5">

  9. Formatiranje teksta • primer liste sa veličinama fonta od 1 do 7 veličina 1 veličina 2 veličina 3 veličina 4 veličina 5 veličina 6 veličina 7

  10. Formatiranje teksta • atributom color menjamo boju teksta • za ovaj atribut važi isto pravilo kao i kod definisanja boja <body> tagom. • ako želimo da u nekom delu teksta promenimo boju fonta u crvenu onda pišemo: <font color="#ff0000"> ovde pišemo tekst. </font>

  11. Formatiranje teksta • uHTML dokumentima postoji mogućnost pisanja podebljanim (bold ili strong) slovima kurzivom (italic), mogućnost podvlačenja (underline) i precrtavanja (strike) teksta.

  12. Formatiranje teksta sledeća tabela prikazuje odgovarajuće tagove kao i rezultate njihove primene:

  13. Formatiranje teksta • mogu se pisati i slova u indeksu ili eksponentu. • indeks se dodaje pomoću taga <sub>, eksponent pomoću taga <sup>

  14. Formatiranje teksta • tekst se u browser-u automatski lomi na kraju reda • to nije dobro ako želimo da neke fraze budu cele u jednom redu • ovo se može postići umetanjem tog dela teksta izmedju tagova: <nobr> ovde ide tekst koji se neće prelomiti na kraju reda </nobr>

  15. Formatiranje teksta • ako je tekst prevelik da stane u jedan red na monitoru, na dnu prozora će se pojaviti horizontalni "klizač"  (scrollbar) i korisnik će morati skrolovati da bi ga pročitao • ako hoćemo da se red da se prelomi, ali na tačno određenom mestu, to možemo postići korišćenjem <wbr> taga. • ovaj tag ne zahteva završni tag • za razliku od <br> taga koji će obvezno 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 omogućava da prelomite neku dugačku reč na kraju reda.

  16. Formatiranje teksta • Kako možemo preći u novi red ili započeti novi odeljak? • kad pišemo tekst u Notepad-u prelazak u novi red se postiže pritiskom na taster ENTER • međutim ovo neće dovesti do prelaska u novi red i na našoj HTML stranici • da bi browser prešao u novi red, to mu moramo eksplicitno narediti odgovarajućim tagom • tag za prelazak u novi red je <br> • on ne zahteva odgovarajući završni tag • prelazak u novi odjeljak postiže se <p> tagom • on ima istu ulogu kao i <br> tag s tom razlikom što će napraviti mali razmak između redova • na kraju odeljka možemo staviti i njegov završni tag, no većina browsera ga ne zahteva, tako da ga možemo izostaviti

  17. Formatiranje teksta • tekst se po defaultu poravnava uz levu marginu • centriranje odeljka ili poravnanje odeljka uz desnu marginu se postiže align atributom. • Align atribut može imati tri vrednosti: left center right

  18. Formatiranje teksta • odgovarajući tagovi za svako od navedenih poravnanja izgledaju ovako: <p align="left"> <p align="center"> <p align="right">

  19. Formatiranje teksta • ako prelazak u novi odeljak nije dovoljan da naglasimo prelazak na neku novu celinu u okviru naše stranice, najbolje rešenje bi bilo da povučemo jednu horizontalnu liniju • liniju možemo povući pomoću <hr> taga • ovaj tag crta tanku sivu liniju preko cele stranice • ako ne želimo da linija bude osenčena već potpuno crna stavimo atribut noshade • dimenzije linije možemo promeniti pomoću dva atributa: size i width atributom size određujemo debljinu linije u pikselima atributom width određujemo dužinu linije ili u pikselima ili u postocima širine stranice • ovaj tag može sadržati align atribut kojem možemododeliti iste vrednosti kao i za odeljak • boju linije možemo odrediti pomoću color atributa na već opisani način za definisanje boja u HTML dokumentima.

  20. Formatiranje teksta • na primer: želimo da povučemo neosenčenu crvenu liniju koja će biti centrirana i čija će debljina iznositi 6 piksela a pružaće se preko 50% širine stranice: <hr noshade align="center" size="6" width="50%" color="#ff0000">

  21. Formatiranje teksta • u editorima teksta tipka "TAB" služi za uvlačenje (engl. indent) teksta tj. za ostavljanje određenog broja praznih mjesta na početku reda (obično se uvlači prvi red pasusa) • u Notepad-u možemo uvući red pritiskanjem tipke "TAB" međutim ovo neće imati nikakvog efekta na tekst koji će biti prikazan u browser-u • u HTML dokumentu možemo uvući red za određeni broj mesta korišćenjem oznake:&nbsp; • ova oznaka ostavlja jedno prazno mesto

  22. Formatiranje teksta • ako hoćemo da ostavimo pet praznih mesta stavimo pet ovakvih oznaka jednu za drugom: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

  23. Primer paragrafa <html> <head> <TITLE> HTML Primer</TITLE> </head> <body> <H1>HTML Uvod</H1> <P>Ovo je primer prvog paragrafa. Koji se radi u okviru formatiranja teksta. </P> <P>Drugi paragraf.</P> <P ALIGN=CENTER> Ovo je centrirani paragraf </P> </body> </html>

  24. Primer osnovnih tagova u HTML <HTML> <HEAD><TITLE>Primeri osnovnih tagova</TITLE></HEAD> <BODY> <H2><P ALIGN=CENTER> HTML</P> </H2> <HR> <P ALIGN=LEFT> HTML (HyperText Markup Language) je veoma jednostavan jezik cije osnove svako moze da sebrzo savlada. </P> <HR> <P ALIGN=RIGHT> Svaki put kada krstareci internetom naletite na neku zanimljivu stranicu , a ne znate kako jenapravljena, njen izvorni HTML kod mozete pogledati ako u liniji menija odaberete: View ->Source (ili View -> Page Source u Netscape Navigatoru).</P>

  25. Primer osnovnih tagova u HTML <HR> <P ALIGN=CENTER>HTML se koristi i u okviru<BR> ASP stranica<BR> JSP stranica, <BR> Zajedno sa JavaScriptom <BR> ili PHP jezikom <BR> ili nekim drugim script jezikom</P> <HR> <P ALIGN=CENTER>HTMLje <DIV ALIGN=LEFT>hiper-</DIV> <DIV ALIGN=CENTER>tekst-</DIV> <DIV ALIGN=RIGHT>Markup jezik.</DIV> Kad savladate osnove HTML-a mozete preci na upoznavanje JavaScripta </P> </BODY> </HTML>

  26. Formatiranje teksta - primer <HTML> <BODY style=”background-color: #ccff33;”> <p> <b> podebljani tekst </b> </p> <p><big>tekst pisan vecim slovima </big> </p> <p><i> iskriviljen text </i> </p> <p> <small>tekst pisan manjim slovima </small> </p> <p>Ovaj tekst je<sub>pisan kao indeks </sub> </p> <p>Ovaj tekst je<sup>pisan kao eksponent </sup> </p> </BODY> </HTML>

  27. Rad sa prelomom linije <html> <head><title> Rad sa prelomom linije </title> </head> <body> <nobr> <h1>Hajde skroluj, skroz na desno, dok se ne vidis sve sto pise u ovom redu...</h1> </nobr> </body> </html>

  28. Rad sa fontovima <html> <head><title> Rad sa fontovima</title> </head> <body> <P> The <FONT FACE="Arial, Helvetica, Geneva" SIZE="+1"><A HREF=“Biblioteka.html">Biblioteka</A></FONT> ima dogovor sa caffe-om <FONT FACE="Arial, Helvetica, Geneva" SIZE="+1"><A HREF="caffe.html">caffe</A></FONT> da Vas tokom nedelje osvezava <FONT FACE="Arial, Helvetica, Geneva" SIZE="+1"><A HREF=“kafaiznenadjenja.html">kafom iznenadjenja</A></FONT> </P> </body> </html> HREF je tag za link

More Related