Uvod u HTML

Osnovni elementi HTML-a

     

Za početak, da se riješimo eventualnog straha, otvorite svoju omiljenu web stranicu i zavirite u njezin kôd. Upotrebljavate li Internet Explorer, kliknite desnom tipkom na pozadinu stranice i odaberite View Source (ili Prikaži izvor za korisnike hrvatske verzije operacijskog sustava). Korisnici Firefoxa odabrat će View Page Source, a i u ostalim preglednicima postupak je sličan.

Desni klik na stranicu u web pregledniku google Chrome
Desni klik na stranicu u web pregledniku Google Chrome
daje izbornik koji sadrži funkciju za pregledavanje
izvornog kôda stranice.

Nakon izbora funkcije za pregledavanje izvora stranice vidite HTML kôd koji opisuje vašu omiljenu stranicu. Složit ćete se da više nije ni približno privlačna kao onda kada je prikazana u web pregledniku. A sad, kada ste se suočili sa strahom, moramo vas uvjeriti da nije ni približno složeno kako izgleda.

HTML kôd sastoji se od oznaka (engl. tag) i piše se po pravilu:

<xyz>
  Tekst koji se prikazuje na stranici.
</xyz>

Oznake mogu pobliže odrediti atributi, što se piše ovako:

<xyz atribut1="vrijednost1"
     atribut2="vrijednost2">
  Tekst koji se prikazuje na stranici.
</xyz>

Osim oznaka i atributa, trebamo još uvesti pojam elementa:

  • element yxz ima početnu oznaku <xyz> i završnu </xyz>
  • element xyz obuhvaća i oznake i sadržaj, dakle element xyz je <xyz ...> ... </xyz>
  • za atribute možemo reći da pripadaju elementima, a nalaze se unutar početnih oznaka.

Dakle, HTML dokument se sastoji od elemenata, a oni se pišu pomoću oznaka, atributa i tekstnog sadržaja.

Primjer oznake

Elementi i atributi imaju unaprijed zadana imena koja moramo naučiti. Na primjer, element kojim se podebljava tekst nosi ime b, pa se odgovarajuća početka i završna oznaka pišu <b> i </b>. Tako ćemo „Tekst koji se prikazuje na stranici” podebljati na sljedeći način:

<b>
  Tekst koji se prikazuje na stranici
</b>

primjer 01

U web pregledniku vidjet ćemo samo tekst koji se nalazi unutar početne i završne oznake <b> i </b>, dok kôd koji opisuje izgled teksta neće biti prikazan.

Ponovite što su:

  • oznake
  • atributi
  • elementi.
CARNet - puni naziv i logo
Accessibility

Boja pozadine

Font

Veličina fonta

1

Boja teksta