HTML tagovi

Dragan Filipović Drugi deo - Skripta, Kurs Comments (0)

Da ponovimo:

HTML koristi sistem tagova (kodova) koji definišu svaki tip elemenata (od linka do slike) na veb strani. Svaki kod ima otvarajući i zatvarajući tag:

– otvarajući tag: <IME_ELEMENTA>
– zatvarajući tag: </IME_ELEMENTA>

Npr: tag za paragraf teksta je <p>. Pa se teskt u kodu vidi na sledeći način:

KOD:

<p> Neki tekst </p>

DIZAJN:

Neki tekst

Tekst između otvarajućeg i zatvarajućeg taga vidi se na veb strani.

Osim imena HTML elementa, tag čini i određeni broj atributa – osobina, čije su vrednosti uokvirene navodnicima.
Element govori browser-u šta da uradi, a atribut kako da to uradi
Primeri:

KOD:

<p align="right"> Neki tekst </p>

DIZAJN:

Neki tekst

Ovde je align=“right“ atribut taga <p>, a right je vrednost atributa align.

Ukratko:

<element atribut=“vrednost“>neki tekst</element>

__________________________________________________________

Do sada smo se upoznali sa osnovni tagovima strane HTML, HEAD i BODY.

Videli smo da Dreamweaver automatski ubacuje dodatne tagove pri kreiranju strane:

KOD:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

Ovo znači da ćemo naš sajt praviti po standardima W3. W3 je organizacija za internet standarde.

U HEAD delu takođe su automatski ubačeni i sledeći tagovi:

KOD:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

što znači da u našem sajtu možemo koristiti nestandardne karaktere, za nas veoma bitna slova č.š isl. To je definisano u delu charset=utf-8, odnosno set karaktera je UTF8, što je međunarodni standard za karaktere, ne samo u web dizajnu, već za tekst uopšte.

____________________________________________________________

Mnogi programi koriste ASCII set karaktera (ovo je američki standard) ali imaju mogućnost da podrže i UTF8. U Dreamweaveru svaki karakter ima svoj html tekstualni kod koji možete da koristite za karaktere koje nemate na tastaturi ( npr: © ® €)

Npr ako kucate u Code delu

KOD:

&#37; &lt; &#48; &#65; % # @ * ( ? + &#169; &#174; &#8364;

U Design delu dobijate

DIZAJN:

% < 0 A % # @ * ( ? + © ® €

Skoro svi osnovni karakteri su isti i u Code i u Design delu. Znači ovo vam treba samo za karaktere koje nemate na tastaturi. I da bi znali šta se to dešava u kodu kada kucate < > i sl.

Odnosno ako u Design delu ukucate

DIZAJN:

< >

U Code delu dobićete

KOD:

&lt; &gt;

&nbsp; je prazan paragraf, koristi se i kao Space, a može se koristiti i kada ne želite da se dve reči razdvoje pri prelomu paragrafa.

__________________________________________________________

KOD:

<title>Untitled Document</title>

Ovo je tag za naslov strane.

Ostali bitni meta tagovi (koji se uvek stavljaju u HEAD deo) su:

KOD:

<meta name="keywords" content="kljucne reci, veb, Web, dizajn, KZM Palilula, kurs" />

<meta name="description" content="Opis sajta, Kurs veb dizajna, Kancelarija za mlade Palilula" />

<meta name="author" content="Dragan Filipovic" />

Komanda za ubacivanje ovih tagova: Insert — HTML — Head tags — Keywords ili Description

___________________________________________________________

Tag za komentar:

KOD:

<!-- -->

<!-- komentar -->

Komanda: Insert — Comment

Komentar se ubacuje u deo za kod (Code view) i služi samo vama za objašnjenje šta je šta u kodu, ne vidi se na strani i može se ubaciti u bilo koji deo koda (Head ili Body). Preporuka je da ubacujete što više komentara.

Boje:

Boje se u HTML kodu definišu kroz kodove za boje:

boje

Npr: Kod za ovu zelenu boju je #56bb40, u Dreamweaveru kao i fotošopu imate Color picker, gde vizuelno birate boju, a kod za tu boju se automatski ubacuje.

Tagove ćemo početi da upoznajemo kroz rad sa tekstom.

Oznake:,

Comments (0) Trackback from your site.

Dragan Filipović

Predavač na Kursu Web Dizajna - Web edukator.

Ostavi komentar

Morate biti prijavljeni da biste dodali komentar.