先前也講過(guò)諸如此類(lèi)的知識(shí)，比如a:hover，通過(guò)a鏈接來(lái)實(shí)現(xiàn)更換背景，但有時(shí)需要更換背景的是某個(gè)div或是table，這時(shí)候使用a:hover顯然就不合適。那具體怎么弄呢，其實(shí)很簡(jiǎn)單。
比如某個(gè)表格或是div的大小初始背景圖片為111.jpg，鼠標(biāo)經(jīng)過(guò)以后要變換的背景是222.jpg，之后鼠標(biāo)離開(kāi)后，還是初始111.jpg背景，從來(lái)實(shí)現(xiàn)鼠標(biāo)經(jīng)過(guò)后的對(duì)背景的變換。準(zhǔn)備材料見(jiàn)附圖一：
代碼展示如下：
<table width="450" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="308" width="450" style="background:url(111.jpg); color:#FFFFFF; font-size:26px;" onmouseout="this.style.background='url(111.jpg)'" onmouseover="this.style.background='url(222.jpg)'">這是table里面的內(nèi)容文字，其實(shí)這個(gè)已經(jīng)不重要了，主要看鼠標(biāo)經(jīng)過(guò)時(shí)的背景變換的效果</td>
</tr>
</table>
放在dreamweaver里面的狀態(tài)見(jiàn)附圖二：
程序運(yùn)行結(jié)果見(jiàn)附圖三：
當(dāng)然這個(gè)背景也可以換成背景顏色，代碼如下：
<table width="450" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="308" width="450" style="background:#f7fcff;" onmouseout="this.style.background='#f7fcff'" onmouseover="this.style.background='#ddeffb'">這是table里面的文字，看鼠標(biāo)經(jīng)過(guò)時(shí)的背景顏色變換的效果，與上面圖片的形式一致，就不附圖給大家看了</td>
</tr>
</table>
上面是鼠標(biāo)經(jīng)過(guò)表格或是div或是某種區(qū)域變換背景的代碼與運(yùn)行，看懂了嗎？其實(shí)不復(fù)雜，動(dòng)手操作一下就會(huì)了。
