Omgjøre bakgrunnsbilde til klikkbar lenke

[Goliath]

Har to bilder øverst på siden som har blitt satt som bakgrunssbilde

 

#ram {
background: url('images/hg.jpg');
margin: 0px auto;
text-align: left;
width: 740px;
}

#name {
background: url('images/name.jpg') no-repeat;
height: 100px;

 

Jeg ønsker å gjøre om disse bildene til klikkbare lenker. Da må jeg vel sette dem som fysisk bilde på siden. Hvordan gjør jeg dette egentlig? Det gjøres vel ikke fra style.css?

 

 

Disse DIV'ene refereres i header.php. Bildene skal være "Home" knapp til en Wordpress-side. Hvilken <?php wp_xxx ?> er til bloggsiden?

Endret 19. november 2006 av Zande

[maZe--]

Om du skal lage disse knappene/bildene om til lenker, så skriver du bare

 

<a href="lenke"><div id="ram"></div></a>

 

Og til den "name".

 

<a href="lenke"><div id="name"></div></a>

 

Dette skal da fungere.

[enden]

Om du skal lage disse knappene/bildene om til lenker, så skriver du bare

 

<a href="lenke"><div id="ram"></div></a>

 

Og til den "name".

 

<a href="lenke"><div id="name"></div></a>

 

Dette skal da fungere.

7315895[/snapback]

Den kommer til å fungere, men gir ikke riktig muspeker i IE, og vil ikke validere. Det er ikke lov å sette blokkelementer inni linjeelementer på den måten. Det korrekte vil være å sette bildet inni a-elementet i HTML-koden for så å stile bildet dersom det er nødvendig fra stilarket.

 

Jeg har denne løsningen på min side (av ren latskap) og her er resultatet: http://validator.w3.org/check?uri=http%3A%...d.net%2Fblog%2F

[Goliath]

Om du skal lage disse knappene/bildene om til lenker, så skriver du bare

 

<a href="lenke"><div id="ram"></div></a>

 

Og til den "name".

 

<a href="lenke"><div id="name"></div></a>

 

Dette skal da fungere.

7315895[/snapback]

 

Ok, men hvor dkal jeg skrive dette? I style.css eller page.php?

[Drømmemannen]

Jeg ville kanskje skrevet noe slikt:

 

<div id="ram">
 <a href="lenke"><span>Klikk meg</span></a>
</div>

og så style dette med

 

#ram a {
   display: block;
}

#ram a span {
   display: none;
}

Da vil du få en tekst du kan klikke på for de som fjerner stylesheetet/bruker eget stylesheet, mens du vil få en "klikkbar div" når ditt stylesheet brukes.

 

Nå vet jeg ikke hvordan dine divs ser ut, om de har annet innhold eller ikke, men det er sikkert mulig å justere litt på a-elementet her slik at det dekker kun bakgrunnsbildet hvis bakgrunnbildet ikke ligger/repeteres bak andre elementer.

 

Nok en mulighet er å legge bakgrunnsbildet på a-elementet i steden for diven.

Endret 19. november 2006 av balletryne