IE6下偽類hover失效問題及解決辦法

第一篇:
在處理CSS的機(jī)制上,拿對偽類:hover的支持來說,IE7+添加了對a以外其它標(biāo)簽的支持,但在IE6下:hover就連對a的支持都不是那么的盡如人意。有的時(shí)候?yàn)榱嗽黾右恍┖唵蔚膭討B(tài)效果,常常會借助:hover的幫忙,比如我們時(shí)常會令鼠標(biāo)經(jīng)過鏈接時(shí)改變文字的顏色。
如:
a:hover{color:#F00;} </p> <p><a href ="#">鼠標(biāo)經(jīng)過時(shí)改變我的顏色</a>
在所有的瀏覽器中都生效。如果換成這樣:
a:hover em{color:#F00;}
<a href ="#">鼠標(biāo)經(jīng)過時(shí)改變我的<em>顏色</em></a>
會發(fā)現(xiàn)在IE6-下什么都沒有發(fā)生,解決方法是只需要再添加一個a:hover{}樣式就可以了,里面可以是zoom,padding,margin等屬性。如下:
a:hover{zoom:1;}
a:hover em{color:#F00;}
<a href="#">鼠標(biāo)經(jīng)過時(shí)改變我的<em>顏色</em></a>
看著恢復(fù)了正常的效果,去想可能是因?yàn)槭裁丛斐?hover失效的。你可以使用zoom,display,padding等等屬性來搞定,于是想會不會是因?yàn)閔aslayout。恩,很有可能就是這樣。但你接著測試,會發(fā)現(xiàn),不論你在a:hover{}寫入任何屬性,color啊,font-size啊,overflow?。ㄉ踔潦遣淮嬖诘膶傩裕鐇x:yyy),都可以使之恢復(fù)正常。
第二篇:
在ie6下如果直接在a的子標(biāo)簽span設(shè)置hover,而a:hover卻不作任何設(shè)置,則在ie6下直接對span的a:hover span{color:red;}會出現(xiàn)失效;但是如果對span的父標(biāo)簽a設(shè)置a:hover{ }則,對span的hover設(shè)置會重新有效。例如:
a span {color:red;}
a:hover span {color:blue;}
此時(shí)a:hover span 的設(shè)置在其他瀏覽器下都正常在ie6下卻沒有任何變化,原因是ie6對a:hover子標(biāo)簽的解讀是建立在父標(biāo)簽的hover設(shè)置上的,換句話說如果不設(shè)置任何父標(biāo)簽a:hover{}則ie6就會停止對a的子標(biāo)簽hover解讀,也就會出現(xiàn)ie6下a:hover設(shè)置失效的問題。解決方法:對父標(biāo)簽設(shè)置a:hover{color:blue;}其中父標(biāo)簽的hover也不是像網(wǎng)上說的隨意設(shè)置任意屬性就可以的;更不是必須和子標(biāo)簽的所有屬性設(shè)置重復(fù)一遍。如css設(shè)置成:
a:hover {font-size:12px;}
a:hover span {color:blue;}
ok,你現(xiàn)在對span的設(shè)置又重新有效了。
相關(guān)文章
a標(biāo)簽的四個css偽類(link、visited、hover、active)樣式理解
偽類是CSS 用于向某些選擇器添加特殊的效果,chrome和firefox中的css監(jiān)控并不會顯示所有的樣式,有些顯示會有點(diǎn)不全,IE下還是有點(diǎn)問題的,不過大體不變2013-05-30csshover.htc在IE7下使用:active偽類無效解決方法
相信做前端開發(fā)都知道,IE6、IE7都不支持:active偽類,IE6更甚,連:hover偽類都不支持。為了解決這個問題,一般都會引入一個csshover.htc文件來解決,本文將介紹解決此問題2012-12-24ie6不支持hover ie6 標(biāo)簽(除a標(biāo)簽)不支持偽類:hover解決方案
ie6環(huán)境下好多的標(biāo)簽除a標(biāo)簽都不支持偽類:hover,本人很是疑惑,于是搜集整理一番,曬出來和大家分享,希望對你們有幫助2012-12-21- 下面小編就為大家?guī)硪黄P(guān)于偽類hover的一些總結(jié)(推薦)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-07-12