HTML-tagit



Tällä sivulla on lista yleisimmistä ja yksinkertaisimmista HTML-kielessä (versiossa 3.2) käytetyistä tageista, näiden määreistä ja määreiden mahdollisista arvoista. Mukana ei ole esimerkiksi scripteihin, frameihin tai kuvakarttoihin tarvittavia tageja.

Kauttaviiva tagin nimen perässä tarkoittaa, että kyseisellä tagilla on vastaava lopputagi. (Suluissa oleva kauttaviiva tarkoittaa, ettei lopetustagi ole välttämätön, mutta yleensä lopetustagia kannattaa aina käyttää jos sellainen on vain olemassa. Tällä saa hyvin varmistettua sivun näkymisen oikein mahdollisimman monessa eri selaimessa.) Arvoissa kokonaan isoilla kirjaimilla kirjoitettu tai heittomerkkien sisällä oleva teksti on tarkoitettu sellaisenaan määren arvoksi.

Jälleen oleten, että osaat jo HTML-kieltä jonkin verran, sillä kaikki tagit ovat vain taulukoissa ja kuvaukset ovat melko suppeita. HTML:ää osaamattomien mielestä tämä saattaa näyttää aika kaoottiselta.






HTML-tagi

Tagi Käyttö Määrite Arvot Merkitys
HTML/ Dokumentin HTML-osa  



HTML-osan tagit

Tagi Käyttö Määrite Arvot Merkitys
HEAD/ Dokumentin otsikko-osa  
BODY/ Dokumentin runko BGCOLOR Väriarvo Taustan väri
TEXT Väriarvo Tekstin väri
LINK, VLINK, ALINK Väriarvo Linkin, seuratun linkin, aktiivisen linkin väri
BACKGROUND URL-osoite Taustakuvatiedosto
MARGINHEIGHT Pikselimäärä Sivun ylä- ja alareunan marginaalin koko
MARGINWIDTH Pikselimäärä Sivun vasemman ja oikean reunan marginaalin koko
TOPMARGIN, BOTTOMMARGIN Pikselimäärä Sivun yläreunan, alareunan marginaalin koko
LEFTMARGIN, RIGHTMARGIN Pikselimäärä Sivun vasemman, oikean reunan marginaalin koko

(Jotkin selaimet käyttävät MARGINHEIGHT- ja MARGINWIDTH-määritteitä ja jotkin toiset selaimet taas TOPMARGIN-, BOTTOMMARGIN-, LEFTMARGIN- ja RIGHTMARGIN-määritteitä. Jos haluaa että sivun marginaalit toimivat mahdollisimman monella selaimella halutulla tavalla, kannattaa asettaa arvo kaikille näille kuudelle määritteelle.)



HEAD-osan tagit

Tagi Käyttö Määrite Arvot Merkitys
TITLE/ Dokumentin otsikko  
LINK Automaattinen linkki REV MADE Sivun tekijä
HREF mailto-osoite  
META META-tagi NAME "description", "keywords", "author", "generator", "refresh"... Sivun kuvaus, avainsanat, tekijä, luomiseen käytetty ohjelma, automaattinen uudelleenpäivitys...
CONTENT Merkkijono  




BODY-osan tagit



Tavalliset

Tagi Käyttö Määrite Arvot Merkitys
H1/, H2/, H3/, H4/, H5/, H6/ Tasojen 1-6 otsikot ALIGN LEFT, RIGHT, CENTER Otsikon siirto vasemmalle, oikealle tai keskelle
P/ Kappalejako ALIGN LEFT, RIGHT, CENTER Tekstin tasaus vasemmalle tai oikealle, tai tekstin keskitys
BR Pakotettu rivinvaihto  
HR Vaakaviiva WIDTH Pikselimäärä tai prosenttiluku Leveys tai leveys suhteessa ruudun kokoon
SIZE Pikselimäärä Paksuus
PRE/ Ennalta muotoiltu teksti  
BLINK/ Vilkkuminen  
<!-- ja --> Kommentin aloitus ja lopetus  



Tekstin muotoilu

Tagi Käyttö Määrite Arvot Merkitys
FONT/ Fontti SIZE +numero , -numero tai numero Koko suhteellisena verrattuna normaalikokoon tai absoluuttisena
COLOR Väriarvo Fontin väri
B/, U/, I/, TT/ Lihavointi, alleviivaus, kursivointi, konekirjoitus  
STRONG/ Vahvennus  
CODE/, KBD/, SAMP/ Ohjelmakoodi, näppäimistökirjoitus, sananmukaistus  
EM/, VAR/, DFN/ Korostus, muuttuja, määrittely  
CITE/, BLOCKQUOTE/ Lainaus, pitkä lainaus  
ADDRESS/ Sähköpostiosoite  



Hypertekstiominaisuudet

Tagi Käyttö Määrite Arvot Merkitys
A/ Hypertekstilinkki NAME Merkkijono Ankkuri jollekin toiselle hypertekstilinkille
HREF URL-osoite ja/tai ankkurin nimi Kohde johon linkki vie
TITLE Merkkijono Linkin kuvaus
IMG Kuva SRC URL-osoite Varsinainen esitettävä kuvatiedosto
LOWSRC URL-osoite Kuvatiedosto joka ladataan ja esitetään ennen varsinaista kuvaa
WIDTH, HEIGHT Pikselimäärä Kuvan leveys ja korkeus (Kannattaa asettaa aina vaikkei näitä määritteitä käyttäisikään kuvan koon muuttamiseen alkuperäisestä, selaimen on nopeampaa piirtää sivu ruudulle kun kuvien koko on etukäteen tiedossa)
ALT Merkkijono Tekstikuvaus kuvasta, joka näkyy yleensä kuvan latauksen aikana, selaimissa joissa kuvat on kytketty pois päältä tai kun hiiri viedään kuvan päälle
BORDER Pikselimäärä Reunan paksuus, 0 poistaa reunan kokonaan
ALIGN LEFT, RIGHT, MIDDLE, TOP, BOTTOM Asettelu suhteessa tekstiin
HSPACE, VSPACE Pikselimäärä Tyhjä tila kuvan vasemmalla ja oikealla puolella, sekä ylä- ja alapuolella
NAME Merkkijono Kuvan nimi (Tämän avulla kuvaan voidaan viitata esimerkiksi JavaScript-funktiosta)



Taulukot

Tagi Käyttö Määrite Arvot Merkitys
TABLE/ Taulukko WIDTH Pikselimäärä tai prosenttiluku Absoluuttinen leveys tai leveys selainikkunan suhteen
BORDER Pikselimäärä Reunan paksuus, 0 poistaa reunat kokonaan
CELLSPACING Pikselimäärä Tyhjä tila solujen välissä
CELLPADDING Pikselimäärä Tyhjä tila solun reunan ja sisällön välissä
ALIGN LEFT, RIGHT, CENTER Taulukon sijoitus vasemmalle, oikealle tai keskelle
CAPTION/ Taulukon otsikko ALIGN TOP, BOTTOM Sijoitus taulukon ylle tai alle
TR(/) Uusi rivi ALIGN LEFT, CENTER, RIGHT Solujen sisällön tasaus vaakasuunnassa
VALIGN TOP, MIDDLE, BOTTOM Solujen sisällön tasaus pystysuunnassa
BGCOLOR Väriarvo Solujen taustaväri
TH(/), TD(/) Otsikkosolu, solu ALIGN LEFT, CENTER, RIGHT Solun sisällön tasaus vaakatasossa
VALIGN TOP, MIDDLE, BOTTOM Solun sisällön tasaus pystysuunnassa
BGCOLOR Väriarvo Solun taustaväri
COLSPAN, ROWSPAN Solumäärä Tekee solusta useamman solun levyisen, korkuisen
WIDTH Prosenttiluku Leveys suhteessa taulukon kokoon
HEIGHT Pikselimäärä Korkeus
NOWRAP   Solun sisältö ei rivity



Listat

Tagi Käyttö Määrite Arvot Merkitys
OL/ Järjestetty lista TYPE "1", "A", "a", "I", "i" Listamerkit ("1,2,3", "A,B,C", "a,b,c", "I,II,III", "i,ii,iii")
START Numero Ensimmäisen alkion järjestysnumero
UL/ Järjestelemätön lista TYPE DISC, CIRCLE, SQUARE Listamerkki (pallo, ympyrä, neliö)
LI Listan alkio TYPE DISC, CIRCLE, SQUARE, "1", "A", "a", "I", "i" Listamerkki
VALUE Numero Alkion järjestysnumero (järjestetyssä listassa)
DL/ Määrittelylista COMPACT   Listan tiivistys
DT, DD Asia, selitys  



Lomakkeet

Tagi Käyttö Määrite Arvot Merkitys
FORM/ Lomake METHOD POST, GET Tapa jolla lomakkeen tiedot välitetään eteenpäin
ACTION URL-osoite Osoite johon listan tiedot lopulta lähetetään, yleensä jokin servletti, php-scripti tai vastaava
NAME Merkkijono Lomakkeen nimi (Tämän avulla lomakkeeseen voidaan viitata esimerkiksi JavaScript-funktiosta)
INPUT Syöte TYPE TEXT, PASSWORD Syötteen tyyppi
NAME Merkkijono Tunnistenimi
VALUE Merkkijono Tekstikentän oletusteksti
SIZE Merkkimäärä Tekstikentän leveys
MAXLENGTH Merkkimäärä Tekstikentän suurin sallittu merkkimäärä
INPUT Syöte TYPE CHECKBOX, RADIO Syötteen tyyppi
NAME Merkkijono Tunnistenimi
VALUE Merkkijono Valinnan teksti
CHECKED   Asettaa valinnan oletusarvoisesti valituksi
INPUT Syöte TYPE HIDDEN, SUBMIT, RESET Syötteen tyyppi
NAME Merkkijono Tunnistenimi
VALUE Merkkijono Kentän tai painikkeen teksti
TEXTAREA/ Tekstialue NAME Merkkijono Tunnistenimi
ROWS, COLS Merkkimäärä Alueen leveys, korkeus
SELECT/ Valintalista NAME Merkkijono Tunnistenimi
OPTION Valintalistan alkio CHECKED   Valinnan esivalinta





Takaisin "HTML"-sivulle



www.tiikoni.net/html/tagit.php Full page map Copyright © Pasi Laaksonen