Free Web space and hosting from dzaba.com
Search the Web

SveZaWeb : Kreiranje Web-a : HTML Uputstvo [ Formatiranje ]
SveZaWeb SveZaWeb SveZaWeb SveZaWeb SveZaWeb
SveZaWeb SveZaWeb SveZaWeb Web Design + Development Tutorials and Articles SveZaWeb EMail | Pretraga | Rečnik    
SveZaWeb
SveZaWeb SveZaWeb Razvoj SveZaWeb SveZaWeb Dizajn SveZaWeb SveZaWeb Kreiranje SveZaWeb SveZaWeb Panorama SveZaWeb SveZaWeb Usluge SveZaWeb Poslednja izmena: 04.05.2003. g.
SveZaWeb  HTMLCSS | XML | XHTML | HTAs | Web servisi  
Web Design + Development Tutorials and Articles SveZaWeb Početna strana : KreiranjeHTML
Formatiranje
   
SveZaWeb SveZaWeb SveZaWeb SveZaWeb SveZaWeb

HTML

Uvod
Istorija HTML-a
Sintaksa
Entiteti
Karakteri
Struktura
Meta podaci
Zajednički atributi
Događaji
Formatiranje
Povezivanje
Multimedija


HTML Primeri
HTML Boje
HTML Znakovi 
HTML Indeks


 

 

HTML obezbeđuje elemente koje vam omogućuju da opišete sadržaj koji dokument nosi tj. da definišete naslove, podnaslove, podbljavate i ističete razne delove teksta itd. kako bi sadržaj bio pogodniji za čitanje i razumevanje.

Hx elementi - Naslovi

U svakom dokumentu potrebno je prvo da definišemo naslov tj. tekst koji se prikazuje slovima većim od standardnih, kako bi bio upadljiviji. Na raspolaganju je šest nivoa naslova (Headers). 

Najveća odgovaraju naslovu prvog nivoa <H1>, a najmanja naslovu obeležena kao <H6>. Ustvari H1 treba da predstavlja naslov knjige, H2 kao naslov sekcije a H3 kao naslov poglavlja itd. ali HTML standard to nezahteva.

 Tag Atributi Opis
<h1> </h1> align
id
class
style
lang
dir
Naslov 1

Naslov 1

<h2> </h2>   Naslov 2

Naslov 1

<h3> </h3>   Naslov 3

Naslov 1

<h4> </h4>   Naslov 4

Naslov 1

<h5> </h5>   Naslov 5
Naslov 1
<h6> </h6>   Naslov 6
Naslov 1

Pored zajedničkih atributa koristi i ALIGN atribut sa vrednostima : left, right, & center

P element

Pasus (pargarf) se definiše tagom <P> a sadrži tekst i ostale HTML elemente osim TABLE i ADRESS elementa. Između pasusa se prikazuje jedna prazna linija. Završni tag je opcioni ali vam preporučujemo da ga koristite pogotova ako povezujete ovaj element sa stil šemom. 

Tag Atributi Opis
<p> </p> align
id
class
style
lang
dir
Pasus

Pored zajedničkih atributa koristi i ALIGN atribut sa vrednostima : left, right, center & justify. U sledećem primeru, tekst u okviru pasusa možemo  poravnati  sa levom ili desnom ivicom ekrana ili pak da ga centriramo, korišćenjem atributa ALIGN.

Kod  U Web čitaču
 <p align="right"> Pasus </p>
 <p> Pasus 2</p>
 <p alagin="center"> Pasus 3 </p>

Pasus l

Pasus 2

Pasus 3

 

BR element

Prelazak u novi red vrši se komndom <BR>, skraćenica od Brek Line (prelomi liniju). <BR> tag nema završni tag pošto nema nikakav sadržaj.

Tag Atributi Opis
<br> clear
id
class
style
lang
dir
Novi red

Preporuka je da se ovaj tag ipak zatvara npr. <br /> zbog XHTML specifikacije.

Kod U Web čitaču
 <p> Prva linija <br> druga linija <br> treca linija.... Prva linija
druga linija
treca linija....

Pored zajedničkih atributa koristi i CLEAR atribut sa vrednostima : left, right, all & none. Atribut CLEAR se koristi kod slika ili tabela da bi novi red započeo ispod ovih elementa.

SveZaWebOvde ide neki tekst i ako ovde postavimo tag <br />
tekst ide u sledeći red a ukoliko stavimo <br clear="left" />


Tekst započinje u novom redu ali ispod slike.

STRONG, EM, CITE, DFN, VAR, B, I & U element

Kada treba nešto isticati a ne predstavlja ni poseban pasus niti naslov koristimo podebljana ili iskošena slova. Za jako isticanje koristimo elementa <STRONG>, Web čitači ovaj elemnt prikazuju kao "bold" tj. podebljana slova ali preko stilova možemo da regulišemo prikaz ovog elementa.

Za slabije isticanje koristimo element <EM>, Wev čitač ovaj element prikazuju kao "italic" tj. iskošena slova ali preko stilova možemo reglisati i prikaz ovog elementa. Ovi elementi prihvataju jedino zajedniče atribute (id, class, style, lang i dir).

 Tag Opis Pregled
 <b> </b>
<strong> </strong>
Podebljana slova Baš ovako
<i> </i>
<em> </em>
<cite> </cite>
<dfn> </dfn>
<var> </var>
Iskošena slova Baš ovako

 

<u> </u> Podvučena slova Baš ovako

Element <b> se više koriste kada je potrbno prikazati samo jedan znak kao podebljan u suprotnom koristite element STRONG. Dok umesto elementa <i> preporučujemo više da koristite <em>, <dfn> , <var> ili <cite> jer ističu više smisao teksta kojeg formatiraju.

Navođenje nekog teksta je obično italic pa se koristi element <CITE> koji u Web čitaču prikazuje sadržaj tog elementa u iskošenim slovima.

Kod definisanja termina u tekstu koriste se iskošena slova pa je pogodnije koristiti <DFN> element umesti elementa <i>.

Takođe prilikom definisanja promenjivih u tekstu koriste se iskošena slova pa se zato umesti <i> elemnta koristi <VAR> element.

NAPOMENA: Podvučen tekst treba izbegavati jer se sa njim označavaju reference ka drugim dokumentima.

Tagovi, kao što smo napomenuli, se ugnježdjavaju a nikad ne ukrštaju:

Pravilno Nepravilno
<STRONG>OVO NE PREDSTAVLJA <EM>GREŠKU </EM></STRONG> <STRONG>OVO PREDSTAVLJA <EM>GREŠKU </STRONG></EM>

FONT element

Element <FONT> vam omogućuje da odredite veličinu, boju i tip (font) teksta. VAŽNO: Koristite stil šeme umesto taga FONT!?!

Kod Atributi Opis
<font>
</font>
color
size
face
Definiše tip fonta za sadržaj koji nosi

Font tag sadrži argumente SIZE koji se odnosi na veličinu fonta, COLOR se odnosi na boju fonta i FACE na tip fonta.

Kod U Web čitaču
<FONT SIZE=2 FACE="Verdana, Arial" >HELO,WORLD </FONT> HELO,WORLD

Atrbut SIZE prima vrednosti od 1 do 7 a ukoliko se ne navede njegova vrednost je 3. Vrednost atributa je opciona može da sadrži '+' ili '-' karater ispred vrednosti radi definisanja relativne veličine u odnosu na BASEFONT tj. na glavni font HTML dokumenta. BASEFONT je unapred definisan na veličinu 3, i može se promeniti pomoću <BASEFONT SIZE ...> elementa.

VAŽNO: Koristite stil šeme umesto taga FONT!?!

Najmanje treba definisati dva fonta, uz to treba imati u vidu koji su fontovi najviše zastupljeni na računarima i dali u našem slučaju podržavaju naša slova. U opštem slučaju to su: Arial, Times New Roman,Verdana, Tahoma i Courier fontove.

Center element

Tag <center> služi nam za centriranje svih elemenata zaključno sa </center>.  Element ne poseduje atribute. Preporučujemo vam da umesto ovog taga koristite <DIV ALIGN="CENTER"> .:. </DIV>, pošto će se najverovatnije isključiti u sledećim verzijam HTML specifikacije.

Centriranje postoji kao atribut u mnogim elementima npr. za naslov:

Kod U Web čitaču
<h2 aligin=center> Centrirani naslov </h2> Centrirani naslov

Kod HTML-a nije moguće poravnjanje obe ivice teksta, on raspoređuje tekst poravnat sa levom ivicom ekrana.

BLOCKQUOTE element

Citati se navode pomoću taga BLOCKQUOTE on može da sadrži i ostale HTML elemente. Pored zajedničkih atributa koristi i CITE atribut u kome se navodi lokacija citata.

Tag Atributi Opis
<blockquote>
</blockquote>
cite
id
class
style
lang
dir
Navođenje citata

NAPOMENA: Ne koristite ovaj element da uvalčite sadržaj pošto to možete učiniti pomoću stilova i možda neće biti u sledećim verzijama HTML-a.

<blockquote>
Šta će se desiti ako ovde stavimo novi pasus i novi red pa pogledajmo kako to izgleda: <p align="right"> Pasus </p>
 <p> Pasus 2</p>
 <p align="center"> Pasus 3 </p>
 <p> Prva linija <br> druga linija <br> treca linija ....
</blockquote>

HR element

Tekstove možemo razdvajati i horizontalnim linijama pomoću tag <hr> (horizontal ruler).

 

Tag Argumenti Opis
<hr> align
width
size
color
Iscrtava horizontalnu liniju za razdvajanje

Debljina linje se postvlja u pikselima pomoću atributa size i ukoliko se ne zada ima vrednost 2, širina se zadaje u procentima ekrana a može i u pikselima atributom width, a boja se zadaje u heksadecimalnom formatu color atributom. Atribut color podržava samo Internet Explorer.

Kod U Web čitaču
Tekst iznad
<hr align="CENTER" size="4" width="75%" color="#ffff00">
Tekst ispod
Tekst iznad
Tekst ispod

NAPOMENA: Izgled podešavajte iz CSS-a

PRE element

Pomoću PRE elementa zadržava postojeće formatiranje u okviru HTML-a. Poseduje samo zajedničke atribute.

Evo primera koji zadržava postojeće formatiranje, znači kako je napisano u HTML dokumentu tako će biti i prikazano u Web čitaču:

 Kod:  U Web čitaču:
<pre> Ovaj tekst bolje nedirati
+------+------+
* 4567 * 0648 *
* 2345 * 5678 *
+------+------+
</pre>
Ovaj tekst bolje nedirati
+------+------+
* 4567 * 0648 *
* 2345 * 5678 *
+------+------+

Ovaj element se primenjuje kod velikih lista i gde ulepšavanja nije ni potrebno. Kao što vidite nije potrebno postvljati BR element pri kraju svakog reda.

INS element

Tag <INS> specifira doadati(insert) tekst u okviru sadržaja od vremena kada je kreiran. Zajedno sa <DEL> elementom predstavalja jedine HTML elemente koji markiraju reviziju dokumenta i jedino je podržan od strane Internet Explorer 4.0. Na ekranu Web čitača tekst koji se nalazi unutar ovih tagova biće prikazan sa podvučenom crtom ali može se pomoću stila promeniti izgled ovog elementa.

Tag Atributi Opis
<ins>
</ins>
cite
datetime
id
class
style
lang
dir
Ubačeni tekst

Pored zajedničkih atributa koristi i CITE atribut u kome se navodi se lokacija koja navodi detalje novog ubačenog teksta i atribut DATETIME koji navodi datum i vreme kada je tekst ubačen u dokument.

Vrednost DATETIME atributa se navodi u UTC formatu tj. YYYY-MM-DDThh:mm:ssTZD koji navodi godinu, mesec, dan, sat, minut, sekund i vremensku zonu.

 Kod:  U Web čitaču:
<INS CITE="http://tvojafirma.com/prodaja
/prodato.html" DATETIME="2001-06-01T17:
53:12+0:00">Nova prodaja...</INS>
Nova prodaja...

DEL element

Tag <DEL> specifira kada je tekst koji dokument sadrži nevažeći od vremena kada je kreiran. Zajedno sa <INS> elementom predstavalja jedine HTML elemente koji markiraju reviziju dokumenta.

Tag Argumenti Opis
<del>
</del>
cite
datetime
id
class
style
lang
dir
Nevažeći tekst

Pored zajedničkih atributa koristi i CITE i DATETIME atribut kao kod INS elementa samo što se ovde navodi lokacija i datum teksta koji je izbrisan.

Kod U Web čitaču
Nema više<del CITE="http://tvojafirma.com/
prodaja/povoljno.proc" DATETIME= "2001-06-01T17:53:13+0:00"> povoljene prodaje...
</del>
Nema više povoljene prodaje...

CODE element

<CODE...> tag potrebno je da se koristi kada se prikazuje programski kod-a i matematičke formule na ekranu Web čitača i on se obično prikazuje pomoću fonta mono spaced. Sadrži jedino zajedničke atribute.

Kod  U Web čitaču
Formula glasi : <CODE>x = (-b+/-(b2-4ac)½) / 2a</CODE>. Formula glasi : x=(-b+/-(b2-4ac)½)/2a

KBD element

<KBD...> tzv. "Keyboard element" koristi se da naznači tekst koje je uneo korisnik i prikazuje se pomoću fonta mono spaced. Obično se koristi kod upustava za korišćenje sistema itd.

Kod U Web čitaču
Da bi se logovali, unesite <KBD>"PRIJATELJ"</KBD> u komadnom prozoru. Da bi se logovali, unesite "PRIJATELJ" u komadnom prozoru.

ACRONYM element

Pomoću ovog elementa definišete skraćenicu a zadaje se tagovima <ACRONYM> </ACRONYM>. Ovaj element je podržan samo od strane Internet Explorer-a.

 Kod U Web čitaču
<ACRONYM TITLE="HyperText Markup Language">HTML</ACRONYM> HTML

BLINK element

Tekst koji se nalazi između tagova <BLINK> i </BLINK> u Web čitaču trepti. Ovaj element je podržan samo od strane Netscape Navigatora i retko se upotrebljava.

Ostali elementi za formatiranje sadržaj:

Tag Opis Primer
<sub> </sub> Subscript Subscript
<sup> </sup> Superscript Superscript
<strike> </strike>
    <s> </s>
Precrtan tekst, nevažeći  Baš ovako
<big> </big> Veliki tekst Baš ovako
<small> </small> Mali tekst Baš ovako
<tt> </tt> Tekst sa pisaće mašine Baš ovako
<address> </address> Informacije o adresi
Milan Skorić
ul.Vlade Zečevića 161
KRUPANj 15314
Srbija i Crna Gora


Zajednički atributi Povratak na početak Povezivanje
  SveZaWeb : Web Design + Development Tutorials and Articles
Slične teme

Prijavite se na naš informator
 

SveZaWeb Informator
Unesite vašu email adresu i kliknite na sliku.  

Powered by groups.yahoo.com

[ Informator SveZaWeb ]

»» Preporuči prijatelju

Pomoć!

Trudimo se da SveZaWeb bude koristan i ispravan, međutim uvek postoje greške, molimo Vas da nam pomognete kako bi ih ispravili.
 
Javi te se : webmaster@
svezaweb.dzaba.com

 

 

  Copyright 1998 - 2003 (c) SveZaWeb. Sva prava zadržana. Politika privatnosti. SveZaWeb Najbolji pregled u 800*600 sa najpopulanijim browser-ima  
SveZaWeb SveZaWeb SveZaWeb SveZaWeb SveZaWeb
 Razvoj   Dizajn   Kreiranje   Panorama   Usluge