XHTML: Kuva 2008-01-12 17:46

Tyhjät elementit eivät ympäröi asiakirjassa olevaa teksti-informaatiota. Ne ovat myös merkinnältään yksiosaisia, eli lopettaminen tehdään lisäämällä yhden ja ainoan tunnisteen loppuun välilyönti ja kauttaviiva ennen tunnisteen päättävää kulmasuljetta. Yksi tyhjistä elementeistä on kuva.

Kuva | Image <img />

Kuvan sijainti määritellään useimmiten suhtellisen linkin tavoin, mutta nyt img-elementin src-attribuutissa. Kuvalle annetaan alt-attribuutissa myös vaihtoehtoinen tekstikuvaus. Kuva on ns. tyhjä elementti joka ei sisällä tekstiä, joten se lopetetaan muista elementeistä poikkeavalla tavalla, kauttaviivalla elementin lopussa. Yleensä kuva sijoitetaan jonkin lohkoelementin sisälle, useimmiten div-elementtiin.

<div>
  <img src="kuvat/puut.jpg" alt="Suomalaista sekametsää" />
</div>

Kuva-elementtiin liittyy olennaisena osana attribuutteja:

• src: Kertoo kuvan sijainnin. (pakollinen)
• alt: Lyhyt tekstikuvaus kuvan sisällöstä. Tämä vaihtoehtoinen tekstikuvaus näytetään kun kuvan lataus ei onnistu. Puhesyntetisaattoriselaimet myös lukevat tekstikuvauksen. (pakollinen)
• title: Käytetään jos halutaan näyttää teksti kun hiiri viedään kuvan päälle. (Huom! Ainakin Internet Explorer näyttää myös alt-attribuutin sisällön puhekuplana.)
• longdesc: Pidempi tekstikuvaus. Käytetään kun alt-attribuutin tila ei riitä kattavalle kuvaukselle.
• height: Kuvan korkeus voidaan määrittää, jolloin sivun muu sisältö asetellaan heti oikeaan korkeuteensa vaikka kuva ei vielä olisi latautunut.
• width: Kuvan leveys voidaan myös määrittää kuten korkeuskin.

Attribuutit

Kuva voidaan lisätä myös taustakuvana (taustagrafiikat, logot). Silloin se lisätään CSS-tyyleissä. Vain varsinaiset sisällölliset kuvat (esim. tekstiin liittyvä kaavio tai henkilön kuva) liitetään img-elementin avulla.

Lisää kuvista sivulla Kuvat ja grafiikka.

Linkit

The alt and title attributes

Attribuutit alt, title ja longdesc.