---
title: "Byt färg på cell vid MouseOver!?"
type: "forum-thread"
url: "https://www.webforum.nu/amne/html-css/63068-byt-färg-på-cell-vid-mouseover"
topic: "HTML & CSS"
topic_url: "https://www.webforum.nu/amne/html-css"
author: "MoneyOpps.nu"
published: "2002-12-25T22:02:12.000Z"
updated: "2002-12-28T13:28:17.000Z"
replies: 18
views: 593
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/html-css/63068-byt-färg-på-cell-vid-mouseover"
---

# Byt färg på cell vid MouseOver!?

## #1 — MoneyOpps.nu, 2002-12-25T22:02Z

Hur gör man för att byta bakgrundsfärg på en cell i en tabell, när man för musen över den ?

Har sett det på några sidor, men aldrig kollat hur man gör ...

Tack på förhand.

Permalänk: https://www.webforum.nu/p/63068

## #2 — mikkeX, 2002-12-25T22:58Z

Var du gör är att du tilldelar a-taggen block egenskaper, vilket gör att taggen täcker hela cellen:

```
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
#lankar
{
width: 300px;
background: red;
color: black;
}
#lankar a
{
display: block;
width: 100%;
color: black;
}
#lankar a:hover
{
background: white;
color: black;
}
</style>
</head>

<body>
<table id="lankar">
  <tr> 
    <td><a href="#">ett</a></td>
    <td><a href="#">tv&aring;</a></td>
    <td><a href="#">tre</a></td>
  </tr>
</table>
</body>
</html>
```

Permalänk: https://www.webforum.nu/p/894326

## #3 — Darren, 2002-12-25T23:57Z

eller så kan du skriva så här:

```
...
   <td onmouseover="this.style.backgroundColor='red';" onmouseout="this.style.backgroundColor='';">din text</td>
...
```

Permalänk: https://www.webforum.nu/p/894336

## #4 — MoneyOpps.nu, 2002-12-26T00:17Z

Tack Darren.
Funkade fint !

Permalänk: https://www.webforum.nu/p/894345

## #5 — Darren, 2002-12-26T00:24Z

Anytime... :)

P.S. Fakturan kommer med posten...  :birp

Permalänk: https://www.webforum.nu/p/894347

## #6 — mikkeX, 2002-12-26T07:03Z

Inte för att jag vill vara sådan... men om det var javascript du ville ha, så varför postade du inte i javascript forumet?

Permalänk: https://www.webforum.nu/p/894402

## #7 — Bäckman, 2002-12-26T14:02Z

Han kanske helt enkelt inte visste att det var så mycket enklare att åstadkomma med hjälp av Javascript? :)

Permalänk: https://www.webforum.nu/p/894480

## #8 — frankof, 2002-12-26T14:14Z

MikkeX\>Om man skall vara petnoga ;) din lösning ändrar **inte** färg på cellen :p

Permalänk: https://www.webforum.nu/p/894484

## #9 — mikkeX, 2002-12-26T15:31Z

> **Bäckman skrev:**
>
> Han kanske helt enkelt inte visste att det var så mycket enklare att åstadkomma med hjälp av Javascript? :)

Enklare att infoga javascript kod vid varje länk än att definera det i stylesheets, och slippa lägga in massa extra kod, det tycker inte jag... men det är väl en smakfråga.

> **frankof skrev:**
>
> MikkeX\>Om man skall vara petnoga  din lösning ändrar inte färg på cellen

Vilket sätt ändrar den inte färgen? a blir en block-tagg som tar upp utrymmet i cellen som motsvarar bakgrunden.

Permalänk: https://www.webforum.nu/p/894505

## #10 — Darren, 2002-12-26T16:18Z

mikkeX, din kod fungerar... Om du har en länk i tabellcellen. Men om du inte har det så kommer det inte att fungera och då skall du använda koden jag skrev.

Och frankof hade rätt. Din kod ändrar inte bakgrundsfärgen på tabellcellen utan på länken.

Ett litet missförstånd verkar det som  :birp.

Permalänk: https://www.webforum.nu/p/894516

## #11 — mikkeX, 2002-12-26T17:00Z

> **Darren skrev:**
>
> mikkeX, din kod fungerar... Om du har en länk i tabellcellen. Men om du inte har det så kommer det inte att fungera och då skall du använda koden jag skrev.
> 
> Och frankof hade rätt. Din kod ändrar inte bakgrundsfärgen på tabellcellen utan på länken.
> 
> Ett litet missförstånd verkar det som  :birp.

Inget missförstånd här inte - min poäng var att frågan postades i xhtml/css-forumet och jag svarade med en xhtml/css lösning, koden som jag lämnade ändrar länkfärgen - ja, men eftersom länken täcker hela cellen ändras bakgrundsfärgen. Dessutom - om JavaScript inte är akriverat i webbläsaren fungerar det inte med en JavaScript-lösning.

Jag säger inte vad som är rätt eller fel - jag svarade bara på frågan, och vad är det för fel med det?

Permalänk: https://www.webforum.nu/p/894531

## #12 — Darren, 2002-12-26T17:58Z

> **mikkeX skrev:**
>
> Inget missförstånd här inte - min poäng var att frågan postades i xhtml/css-forumet och jag svarade med en xhtml/css lösning, koden som jag lämnade ändrar länkfärgen - ja, men eftersom länken täcker hela cellen ändras bakgrundsfärgen. Dessutom - om JavaScript inte är akriverat i webbläsaren fungerar det inte med en JavaScript-lösning.
> 
> Jag säger inte vad som är rätt eller fel - jag svarade bara på frågan, och vad är det för fel med det?

Vi lägger ner detta nu tycker jag. Han/Hon har fått svar och är nöjd så jag tycker att det är meningslöst att vi håller på och tjafsar om vem som har rätt eller fel... Båda lösningar fungerar beroende vad man skall använda de till.

Permalänk: https://www.webforum.nu/p/894549

## #13 — frankof, 2002-12-26T18:01Z

lugna ner dig grabben ;)

> Jag säger inte vad som är rätt eller fel - jag svarade bara på frågan, och vad är det för fel med det?

Nä, det gör du inte, om det skall vara petnoga, du svarade på hur man får en "a-tag" till att fylla en hel cell ( \<td\>\</td\> ).
Byta bakgrundsfärgpå en cell gör man enklast med javascript.
Teoretiskt skulle det fungera med css också men det gör det inte(hover skulle kunna användas på alla element men fungerar bara på "a")

Permalänk: https://www.webforum.nu/p/894551

## #14 — mikkeX, 2002-12-26T19:15Z

> **frankof skrev:**
>
> lugna ner dig grabben ;)

Jag är lugn, och jag vill helst inte bli kallad grabben, jag har passerat 30 strecket ... :-)

Du kan mycket väl använda hover på td - men det fungerar endast i NS 7 (och Mozilla).

```
td:hover
{
background: red;
}
```

Som sagt, min poäng var att frågan ställdes i xhtml/css forumet, men det verkar inte en kotte bry sig om. Så jag ska inte tjata.

Permalänk: https://www.webforum.nu/p/894572

## #15 — dectgap, 2002-12-26T19:56Z

```
onmouseover="this.style.backgroundColor='red';"
```

Ursäkta, men det där är inte alls javascript. "onmouseover" är ju ett html-attribut, och resten är DOM.

Hur som helst tycker jag att din lösning, mikkeX, var väldigt snygg :)

Permalänk: https://www.webforum.nu/p/894589

## #16 — jarvklo, 2002-12-26T20:28Z

Hmm... §jr 

> The Document Object Model is a **platform- and language-neutral interface** that will allow programs and scripts to dynamically access and update the content, structure and style of documents.

Skall vi vara **riktigt** noga så är alltså 

```
this.style.backgroundColor='red';
```

 en tilldelningssats i Javascript i just detta fall... 

Tilldelningen av (sträng)värdet 'red' görs via interfacet i DOM till ett attribut som hör till ett visst (för-)definierat objekt som motsvarar den aktuella taggens innehåll m.m. 

Javascriptkoden binds i exemplet till objektets interna händelsehantering genom att den lagts som strängvärde till (x)html-attributet onmouseover... 

Man hade lika gärna kunnat binda scriptet till den taggen genom en tilldelning direkt i en Javascriptsats (men det är en annan historia :e ) - och som MikkeX påpekade är den historien antagligen bättre lämpad i ett annat forum

Källor: 
<http://www.w3.org/DOM/#what>
och
<http://www.w3.org/TR/html401/interact/scripts.html#h-18.2.3> 

MikkeX:s metod funkar oavsett om man har Javascript på eller av i sin webbläsare när man besöker sidan, onmouseover-varianten gör det inte...

PEACE  :birp

Permalänk: https://www.webforum.nu/p/894600

## #17 — frankof, 2002-12-27T17:40Z

> Jag är lugn, och jag vill helst inte bli kallad grabben, jag har passerat 30 strecket ... :-)

Som sagt, grabben ;) :e
Jag tyckte försåvit att din lösning var snygg, och den passde rätt bra i detta forument, jag reagerade lite på din "sura" kommentar ang. att lösa det med javascript. 
Det är inte alla som har skillnaderna så klart för sig som du har.

Permalänk: https://www.webforum.nu/p/894933

## #18 — mikkeX, 2002-12-28T00:50Z

> **frankof skrev:**
>
> \[...\]jag reagerade lite på din "sura" kommentar ang. att lösa det med javascript\[...\]

Hm, var hittar du den sura kommentaren?

Permalänk: https://www.webforum.nu/p/895105

## #19 — frankof, 2002-12-28T13:28Z

> Inte för att jag vill vara sådan... men om det var javascript du ville ha, så varför postade du inte i javascript forumet?

Denna menade jag, kanske inte var menat "surt", men vedkommande kanske inte visste om att det var javascriptlösningar han/hon hade sett på nätet(vilket är rätt troligt).

Permalänk: https://www.webforum.nu/p/895240

---

Tråden på webben: https://www.webforum.nu/amne/html-css/63068-byt-färg-på-cell-vid-mouseover
