這里向大家簡單介紹一下如何讓鼠標經過時改變DIV背景顏色，當鼠標經過的時候改變網頁和層的DIV背景顏色，應該會有很多的方法，目前整理出來比較常用的三種方法，相信本文介紹一定會讓你有所收獲。

三種方法鼠標經過改變DIV背景顏色

當鼠標經過的時候改變網頁和層的DIV背景顏色，應該會有很多的方法，目前整理出來的這三種方法是比較常用的，希望對你的學習有所幫助。

方法一

#div:hover{background:#000000;}  
 

解釋:鼠標經過id為div的元素時DIV背景變色

IE6.0、Firefox2.0、Opera9.23都不行

方法二

<divonmouseoverdivonmouseover="this.style.backgroundColor='#F4F9FD'" 
 
onmouseout="this.style.backgroundColor='#FFFFFF'"></div> 
 

方法三:

<style> 
.d_over{background-color:#307172;}  
.d_out{background-color:#EFEFEF;}  
</style> 
 
<divclassdivclass="d_out"onmouseover="this.className='d_over'"  
onmouseout="this.className='d_out'">DIV背景顏色</div> 
 
 

<a>的標簽是可以，可是，這樣子會導致其它帶有<a>標簽的也跟著變色。

一般<a>是用來定義鏈接的樣式的，并不是定義某個區域的。現在常用的DIV+CSS的網頁用，DIV就是表示區域的意思，還是喜歡用這種，當然用table的話，會有更簡單的方法。

【編輯推薦】

1. DIV背景透明樣式使用
2. JavaScript動態創建div屬性和樣式
3. CSS中border和clear兩大屬性用法揭秘
4. 實現DIV居中布局三種途徑
5. 解讀DIV CSS網頁布局中CSS無效十個原因