<pre class="code">&lt;style type="text/css"&gt; td.mouseOver { background: #f7f7f7; } td.mouseOut { background: #fff; } &lt;/style&gt;</pre>로 선언해 주시고요..<pre class="code">&lt;td onMouseOver="this.className='mouseOver';" onMouseOut="this.className='mouseOut'"&gt;</pre>으로 하시면 됩니다. IE 에서는 이 방법밖에 없는 것 같고요.... FireFox 에서는 <pre class="code">setAttribute("class","myClass");</pre>를 사용할 수 있습니다. 스크립트에 this.onMouseOut="myMouseOutFunction();" 을 추가해 주면 td 에는 그냥<pre class="code">&lt;td onMouseOver="myMouseOverFunction();"&gt;</pre>와 같이만 해주어도 나머지 마우스 아웃이 script 로 구현이 되기 때문에 소스가 아주 간단해 지지요!! 그러나 현실적으로는 IE 에서 지원이 안되기 때문에 사용 불가능 합니다. ㅜㅜ 또 하나 재미 있는 것은요... 만약 색을 바꿔야 하는 td 의 내용이 글씨 뿐이라면.. :hover 슈도엘리먼트를 쓸 수 있습니다. <pre class="code">a:link, a:visited { display: block; background: #fff; } a:hover { display: block; background: #f7f7f7; }</pre>하시면 td 를 사용하지 않고서도 anchor 를 display: block 으로 바꾸고 width 와 height 를 주면 pure CSS 로 script 를 쓴것 과 같은 효과를 줄 수 있습니다.