鼠標(biāo)經(jīng)過(guò)時(shí)改變DIV背景顏色的三種途徑
作者：post
使用DIV CSS技術(shù)進(jìn)行網(wǎng)頁(yè)布局時(shí)有很多比較懸的效果可以實(shí)現(xiàn)，這里就向大家介紹一下鼠標(biāo)經(jīng)過(guò)改變DIV背景顏色，主要描述三種方式，相信你一定會(huì)感興趣。
這里向大家簡(jiǎn)單介紹一下如何讓鼠標(biāo)經(jīng)過(guò)時(shí)改變DIV背景顏色，當(dāng)鼠標(biāo)經(jīng)過(guò)的時(shí)候改變網(wǎng)頁(yè)和層的DIV背景顏色，應(yīng)該會(huì)有很多的方法，目前整理出來(lái)比較常用的三種方法，相信本文介紹一定會(huì)讓你有所收獲。
三種方法鼠標(biāo)經(jīng)過(guò)改變DIV背景顏色
當(dāng)鼠標(biāo)經(jīng)過(guò)的時(shí)候改變網(wǎng)頁(yè)和層的DIV背景顏色，應(yīng)該會(huì)有很多的方法，目前整理出來(lái)的這三種方法是比較常用的，希望對(duì)你的學(xué)習(xí)有所幫助。
方法一
- #div:hover{background:#000000;}
解釋:鼠標(biāo)經(jīng)過(guò)id為div的元素時(shí)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>的標(biāo)簽是可以，可是，這樣子會(huì)導(dǎo)致其它帶有<a>標(biāo)簽的也跟著變色。
一般<a>是用來(lái)定義鏈接的樣式的，并不是定義某個(gè)區(qū)域的。現(xiàn)在常用的DIV+CSS的網(wǎng)頁(yè)用，DIV就是表示區(qū)域的意思，還是喜歡用這種，當(dāng)然用table的話，會(huì)有更簡(jiǎn)單的方法。
【編輯推薦】
- DIV背景透明樣式使用
- JavaScript動(dòng)態(tài)創(chuàng)建div屬性和樣式
- CSS中border和clear兩大屬性用法揭秘
- 實(shí)現(xiàn)DIV居中布局三種途徑
- 解讀DIV CSS網(wǎng)頁(yè)布局中CSS無(wú)效十個(gè)原因
責(zé)任編輯：佚名
來(lái)源：
lam5.cn
