I denne delen skal du lære meir om:
Vi er no komen til den første av fleire delar som skal omhandle hypertekst. Med hypertekst meiner vi evna til å kunne referere til og koble til andre dokument eller andre avsnitt i same dokumentet, eigenskapen som gav HTML namnet sitt og som har gjort dette formatet så populært i dagens informasjonssamfunn.
Å lage bokmerke og kunne vise til desse er særs nyttig i store dokument, der ein skal kunne leite seg fram til informasjon raskt. Å leggje til bokmerke gjer ein enkelt med id-attributtet. Dette attributtet kan ein nytte i omlag alle element i HTML og gjev elementet eit unikt namn.
id="
bokmerket"
I hermeteikna skriv ein namnet på bokmerket. Her er det verdt å merke seg at ein skil mellom store og små bokstavar og at namnet må vere unikt i eit dokument. Altså:
id="
dette"
er ikkje det same som
id="
DETTE"
Du kan som sagt ikkje ha to like id
-attributt i same dokument. Dessutan må id
starte med ein bokstav mellom A-Z eller a-z og kan ellers innehalde bokstavar (A-Z, a-z), tal (0-9), bindestrek (-), understrek (_), kolon (:), eller punktum (.).
Som sagt kan du putte id
-attributtet i eit element for å gje dette eit namn. Dette namnet kan mellom anna refererast til som eit bokmerke.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>
Bokmerke</title>
</head>
<body>
<h1>
Bokmerket</h1>
<p>
Her viser vi til bokmerket.</p>
<h2 id="
maalet">
Målet</h2>
<p>
Her er bokmerket vi skal vise til.</p>
</body>
</html>
Denne fila har eg kalla bokmerke.html. Det nye attributtet har vi i dette dømet putta inn i <h2></h2>
. Bokmerket er dermed lagt inn i <h2>
og heiter «maalet». Vi nyttar same fila til neste steg, nemleg å lage ei lenkje til bokmerket.
For å kunne gå til bokmerket må vi, som tidlegare nemnd, nytte hypertekst. Eit av elementa som blir nytta til dette føremonet er <a>
, der «a» står for anchor, eller anker. Dette elementet blir nytta for å lage lenkjer i tekst og bilete og knyte desse til tekst eller bilete på ei anna side, eller som i vårt tilfelle ein annan stad på same sida. <a>
nyttar du på denne måten:
<a href="
lenkje">
tekst eller bilete</a>
I dømet ovanfor har vi lagt anker-elementet rundt teksten eller biletet vi vil skal kunne trykkast på for å kome til målet vi viser til. Attributtet href, eller hypertekstreferanse, skal innehalde namnet på den fila eller det bokmerket som det skal visast til. For å vise korleis dette fungerer i praksis gjer vi ei lita endring i den forrige fila:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>
Bokmerke</title>
</head>
<body>
<h1>
Bokmerket</h1>
<p>
Her viser vi til <a href="
#maalet">
bokmerket</a>
.</p>
<h2 id="
maalet">
Målet</h2>
<p>
Her er bokmerket vi skal vise til.</p>
</body>
</html>
Dette dømet har eg gitt namnet bokmerke2.html. Her kan du sjå at anker-elementet er lagt rundt ordet «bokmerke». Opnar du fila, vil du sjå at dette ordet er blitt til ei klikkbar lenkje. Attributtet href inneheld namnet på bokmerket vi skal vise til. Merk deg teiknet # framfor namnet. Dette teiknet fortel at «maalet» er eit bokmerke og er difor viktig å ta med.
Fila bokmerke2.html vil nok ikkje gje eit tydeleg døme på korleis bokmerke i HTML-dokument verkar. Men bokmerke finn du óg på denne sida du les på no. Øverst på sida er det lenkjer til dei ulike overskriftene i dette dokumentet. Lenkja gå til toppen av dokumentet
vil føre deg til bokmerket «topp» øverst på sida. Der er det døme på fleire bokmerke på denne sida. Hald musepeikaren over lenkjene for å få ei forklaring på desse.
Dette kurset er laga for vidareutdanninga i helse og sosialinformatikk ved Høgskolen i Bergen.