HTML-elementit

HTML Elementit

HTML dokumentit ovat tekstitiedostoja jotka koostuvat HTML-elementeistä.

HTML elementit määritellään käyttäen HTML-tageja.

HTML Tagit

  • HTML-tageja käytetään merkitsemään HTML elementtejä
  • HTML-tagit ympäröidään "<"- ja ">"-merkein
  • HTML-tageja käytetään yleensä pareittain, esimerkiksi <b> ja </b>
  • Parin ensimmäinen tagi on alkutagi ja toinen tagi on lopputagi
  • Alku- ja lopputagin välissä oleva tekstin on elementin sisältö
  • Suositeltavaa on kirjoittaa tagi aina pienin kirjaimin (siis <b> vaan ei <B>)

HTML Elementit

Palautetaan mieleen edellinen esimerkki. 

<html>  
<head>  
<title>Sivun otsikko</title>  
</head>  
<body>
Tämä on ensimmäinen kotisivuni. <b>Tämä teksti on vahvistettua.</b>  
</body>  
</html>

Tässä on eräs HTML-elementti:

<b>Tämä teksti on vahvistettua.</b>

HTML-elementti alkaa alkutagilla: <b>
HTML-elementin sisältö on: Tämä teksti on vahvistettua.
HTML-elementti päättyy lopputagiin : </b>

Tagin <b> tarkoitus on määritellä HTML-elementti, jonka sisältö näytetään vahvennettuna.

Myös tämä on HTML-elementti :

<body>
Tämä on ensimmäinen kotisivuni. <b>Tämä teksti on vahvistettua.</b>  
</body>

Tämän HTML-elementin alkutagi on <body> ja lopputagi </body>.

<body> tagin tarkoitus on määritellä HTML-elementti, joka sisältää HTML-dokumentin rungon.

Miksi tagit kannattaa kirjoittaa pienin kirjaimin?

HTML:ssä tagit eivät ole kirjaimen koosta riippuvaisia. <B> tarkoittaa samaa kuin <b>. Web-sivujen lähdekoodi tarkastellessa voidaan huomata, että suuri osa sivuista käyttää suuria kirjaimia tageissa. Tällä kurssilla käytetään aina vain pieniä kirjaimia, mutta miksi?

Jos halutaan noudattaa uusimpia standardeja, tulee aina käyttää tageissa vain pieniä kirjaimia. The World Wide Web Consortium (W3C) suosittelee pienten kirjaimien käyttämistä HTML 4:ssä ja XHTML, jota käsitellään myöhemmin, vaatii pienten kirjaimien käyttöä.

Tagien attribuutit

Tageilla voi olla attribuutteja. Attribuutti tarjoaa lisätietoa HTML-elementistä.

Seuraava tagi määrittää HTML-taulukon: <table>. Border-attribuutin avulla voidaan selaimelle kertoa, että taulukko halutaan esittää ilman reunuksia:
<table border="0">

Attributit ovat aina nimi/arvo-pareja: nimi ="arvo".

Attribuutit sijaitsevat aina HTML-elementin alkutagissa.

Attribuutit ja niiden arvot ovat kirjainten koosta riippumattomia. W3C kuitenkin suosittaa käyttämään HTML 4:n attribuuteissa vain pieniä kirjaimia ja XHTML vaatii pienten kirjaimien käyttöä.

Laita attribuutin arvo aina lainausmerkkeihin

Attribuuttien arvot tulee kirjoittaa aina lainausmerkkien sisään. Lainausmerkkien lisäksi myös heittomerkit ovat sallittu vaihtoehto, mutta lainausmerkit ovat yleisemmin käytetyt.

Tilanteessa jossa arvo sisältää lainausmerkin on tarpeen käyttää heittomerkkejä:

nimi='John "ShotGun" Nelson'