Bildetekst

I HTML5 fins det to nyttige element som heiter figure og figcaption. Her er noken eksempel på bruken av det.

Bilde uten bildetekst:

Elementet figure er ein boks du kan putta utenpå eit bilde som du legg inn med img som vanlig slik:

Baby Orangutang hengande frå eit tau.

Her er koden  for det:


	<figure>
		<img src="/orang-utan.jpg" alt="Baby Orangutang hengande frå eit tau.">
	</figure>
	

Bilde med bildetekst:

I tillegg til bildet kan vi leggja inn bildetekst vha elementet figcaption inne i figure-elementet:

Macaque in the trees
Makak-ape, Nedre Kintaganban River, Borneo. Foto: Richard Clark

Koden er slik:


	<figure>
		  <img src="/macaque.jpg" alt="Macaque in the trees">
		  <figcaption>Makak-ape, Nedre Kintaganban River, Borneo. 
			Foto: <a href="http://www.flickr.com/photos/rclark/">Richard Clark</a>
		</figcaption>
	</figure>
	

Fleire bilder med samme bildetekst:

Du kan også leggja fleire bilder inn i samme figure-element, slik:

Kookaburra Pelikan Rainbow Lorikeet
Australske fuglar: Kookburra, Pelican og Rainbow Lorikeet. Foto: Richard Clark
Koden for det er:

	<figure>
		<img src="/kookaburra.jpg" alt="Kookaburra">
		<img src="/pelican.jpg" alt="Pelikan">
		<img src="/lorikeet.jpg" alt="Rainbow Lorikeet">
		<figcaption>Australske fuglar: Kookaburra, Pelikan og Rainbow Lorikeet. 
			Foto: <a href="http://www.flickr.com/photos/rclark/">Richard Clark</a>
		</figcaption>
	</figure>