Sadržaj:

Uvod

struktura html stranice

 

Jednostavni elementi

paragraf

font

dekoracije teksta

anchor

span

unordered i ordered list

definition list

div

image

Kompleksni

map

area

table

table head

table body

table foot

th, tr, td elementi

frameset

frame

iframe

form

input

textarea

optgroup

option

 

 

 

 

 

 

cognita e-learner sustav za elearning učenje edukacija

Online učenje, računalana obuka, informatički tečajevi - Edukacija.net najbolji i najkvaliteniji e-learning u Hrvatskoj

HTML priručnik

Osnovni HTML tagovi

Jednostavni

DIV

Div element je omotač koji služi za dodavanje strukture i konteksta za bilo koji blok elemenata. Njega upotreba je vrlo široka. Npr. često se korsiti za poravnanje teksta i za dodavanje stila fonta za veći broj paragraf elemenata (stil navodimo samo u div elementu, a ne u svim elementima). Također često se upotrebaljava kao imenovani okvir (layer) definiran CSS stilom, unutar kojeg se CSS selectorima redifiniraju HTML elementi. Široka upotreba div taga je u tome što on može prihvatiti sve CSS atribute – što znači da u njemu možemo odrediti font, margine i razmake, okvire, pozicioniranje u prozoru i drugo.
Atributi:
align – poravnanje: vrijednosti: left, right, center, justify (paragraf teksta omotamo div tagom s odgovarajućim poravnanjem)

 

<h1><cite>Lorem ipsum dolor sit amet</cite></h1>
<div style="width:400px; ">
<div style="background-color:#0000CC; color:#FFFFFF; width:25px; padding:5px; float:left; margin-right:10px;">
Sadržaj unutar teksta u kućici</div>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis enim metus, pharetra eget, cursus vitae, mollis sit amet, nulla. Nunc aliquam congue magna. Curabitur quis justo. Aenean volutpat lectus eu metus. Vivamus ultrices nisi ut turpis. Nam risus pede, tempus blandit, fringilla non, vestibulum eu, tellus. Sed ut lacus sit amet mi suscipit ullamcorper. Nunc eu velit ac sem suscipit ultrices. Etiam metus. Sed elementum dignissim tortor. Proin ornare vestibulum enim. Cras et dolor. Praesent eros. In a leo ac est condimentum elementum. Mauris ultricies felis vitae nibh. Phasellus eget urna eu felis egestas suscipit.<br>
</div>

 

IMG

Image element prikazuje odgovarajuću MIME tip datoteku, ukoliko je ona podržava od preglednika u koje dokument prikazujemo. Široko podržani tipovi datoteka su jpg, gif, png. Ukoliko želimo slici dodati mogućnost linka, onda ju omotamo anchor tagom ili joj dodijelimo image map (objašenjeno kasnije). Kada želimo sliku pozicionirati i odmaknuti upotrebom CCS stila, tada se ne preporuča direktno ubacivanje stila u sliku, već u umotač oko slike (div ili span tag).
Atributi:
align – poravnanje: poravnava element u pripadajućem omotaču prema definiranim marginama pripadajućeg omotača i omogućuje da se sljedeći sadržaj (tekst) omota oko slike (to nije slučaj ukoliko se radi o centriranom poravnanju). Vrijednosti: left, right, center
alt – alternativni opis: prikazuje tekst ukoliko preglednik ne podržava prikaz slika (kao npr. preglednici na mobitelima), te umjesto slike prikazuje taj tekst. Atribut se koristi za opisivajne sadržaja slike (sadržaj je uključen u pretragu kod internet tražilice) ili za prikaz tooltip-ova kod internet explorera (mali kvadratić koji se pojavljuje kao objašenje, koristi se kada slika ima funkciju linka u web aplikaciji, čime se tim tekstom objašnjava akcija komande)
border – okvir: definira liniju okvira oko slike koja je obojana bojom teksta ili bojom linka, tradicionalno se postavlja na 0.
height, width – širina i visina slike: atributi koji definiraju širinu i visinu slike. Ukoliko ne navedemo ove parametre, preglednik će za parametre uzeti orginalne proporcije slike, a ukoliko navedemo samo jedan parametar, preglednik će automatski izračunati drugi parametar u sukladnim proporcijama i sukladnom mjerilu. Ukoliko se slika u manjoj mjeri razlikuje od okvira u koji ju želimo ugraditi na stranici (npr. želimo da sve slike budu dimenzija 300*150 piksela), možemo je prisilno istegnuti na te dimenzije (oprez, jer takve akcije iskrivljuju sliku i umanjuju njezinu kvalitetu)
hspace, vspace – horizontalni i vertikalni prostor: određuje prostor (gore-dolje ili lijevo -desno) koji pozicionira sliku u onosu na omotač u kojem se nalazi.
longdesc – širi opis slike: označava URL s tekstom opisa slike. Namjenjen je ljudima s oštećenjima, kako bi oni mogli uz pomoć programa za čitanje čuti opis slike.
lowsrc – slika niže rezolucije: omogućuje učitavanje slike istih dimenzija, koja je manje veličine. Atribut je vrlo koristan za stranice namjenjene publici s sporim vezama (preglednik prvo učita sliku manje rezolucije, a nakon toga orginalnu sliku).
src – adresa slike: valjana adresa slike
usemap – upotreba mape: atribut koji slici dodaje postojeću koordinatnu mapu (image map) definiranu map i area atributima. Dodajemo simbol # iz kojeg slijedi ime mape (isto kao i kod anchor taga)

 

<body style="background-color:#0000FF;">
<div style="background-color:#FFFFFF; margin:10px; width:276px; height:110px;">
<a href="http://www.google.com"><img src="http://www.google.com/intl/hr_ALL/images/logo.gif" border="0"></a>
</div></body>

 

Stranice: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10

 

Web dizajn i development edukacija:

Instalacija Internet Information Servera

Resursi na internetu


Ostala rješenja

Cjenik za internet rješenja i usluge prema zahtjevima korisnika

Web dizaj i izrada web stranica, internet marketing, razvoj windows aplikacija


Uz uslugu izrade stranica nudimo edukaciju korisnika za korištenje internet tehnologije, konfiugiranje uredskih programa u skladu s dizajnom i uvedenim rješenjima.

 

Konkretne prednosti prilikom uvođa naših rješenja za male tvrtke i pregled tehnologije

 

Obrazac za savjetovanje pri ulaganju u informatičku tehnologiju