a:hover在IE6中的BUG

AI权益加码!Claude Code、Cursor等20+工具免费用! 购周边限时加赠Coding Plan Lite,畅享主流AI工具!学习进阶更高效! 阅读详情

这也是最近工作中碰到的一个问题,其实以前也经常碰到过。具体是这样的,有一个图片链接,为了有明显一些的提示效果,需要在鼠标移上去的时候把它放大。按思路来说,其实是很容易的,只要在a:hover img{}里定义鼠标经过时改变图片的大小就可以了。但实际上,在IE6中,a:hover img{}里定义的内容并不生效。

IE6对伪类的支持真的很烂,除了A标签外其它标签都不支持:hover伪类,而偏偏这个唯一支持的a:hover也还有着BUG。解决的方法就是给a:hover {}定义一个属性:

a:hover {zoom:1;}/*这里可以换成其他很多的属性。*/
a:hover img {……}

在网上找出的答案基本上都是这样,的确这样能解决问题,但却都没有说这个BUG到底是为什么。最初我是以为是要触发layout,但经过试验,不能触发layout的属性也能生效,比如说color、border之类的。也就是这一次,我才找到此BUG的原因所在:当a:hover {}的属性跟a {}中的是一样的时候,也就是说a:hover没有发生属性的改变,完全继承a的属性的时候,就会产生此BUG。所以给a:hover {}定义一个属性值就能解决这个问题,至于定义什么值就看具体情况了,至少可以不用zoom这个看起来有hack嫌疑的属性咯。

html5鼠标悬停图片变淡,鼠标移动悬停在图片上图片变色或半透明变化效果实现... DIV CSS鼠标移动悬停在图片上图片变色或半无色变幻成效完成,CSS鼠标悬停图片上图片变灰、图片变色、图片半透明一、CSS5先容与说明:看到网页中的图片当鼠标挪动到图片上时(鼠标悬停在图片上)图片变灰,看似变色变灰成就,现实是图片被CSS设置装备摆设为半透明花色。二、要害CSS代码:a:hoverimg{filter:alpha(Opacity=80);-moz-opacity:0.8;opa... 阅读详情

相关推荐

IE6bug整理(hover a:hover) IE6 a:hover 无效

IE6bug整理(hover a:hover span) By Diaoyude  | 发布时间: 08-23 16:38  | Hits:857 | Post in: WEB前端 , Div-Css ie6 a:hover span 今天在项目中遇到了这样的一

renpinghao的专栏 1951

IE6 中 a:hoverbug (转)

如上图,在制作数码热销排行的页面时,每种手机的图片都是固定的160×120大小,但是出于页面美观及内容可读性的考虑,在列表页上图片都压缩为原大小的50%显示;也就是80×60像素大小。不过当用户将鼠标移动到缩略图上时,我们会按原图大小显示出来。类似的效果在抓虾上也被应用在显示用户

讲不出再见 649

IE6 中 a:hoverbug

如上图,在制作数码热销排行的页面时,每种手机的图片都是固定的160×120大小,但是出于页面美观及内容可读性的考虑,在列表页上图片都压缩为 原大小的50%显示;也就是80×60像素大小。不过当用户将鼠标移动到缩略图上时,我们会按原图大小显示出来。类似的效果在抓虾上也被应用在显示用户头 像上:抓虾使用的

1727

a:hover bug display in IE6

Just a small style problem. [code="html"] sample text [/code] If its style like this: [code="css"] a:hover{text-decoration: underline;} [/code] ,the underline won't show up in IE6. Becaus...

无泪之城 183

ie6不支持 形如a:hover span{} bug

在a:hover{}写入任何属性,color啊,font-size啊,overflow啊(甚至是不存在的属性,如xx:yyy),都可以使a:hover span{}有效。 #nav a:hover{display:block;background:#333;color:#CCC;}/*在ie6下至少写一个属性,否则下面样式无效*/#nav a:hover .en{display:inl...

diaosheng8387的博客 194

IE6不支持非A元素:hover伪类的bug的处理

     使用IE的behavior即可!      使用方法是定义样式:body { behavior:url(”csshover.htc”); }      csshover.htc的代码http://www.xs4all.nl/~peterned/htc/csshover.htc 这个代码不但支持:hover 而且还支持 :active 另外支持上述样式之外还增加了对:focus

boral_li的专栏 846

ie6 a的hover无效

这是IE6处理CSS伪类:hoverBug。例如如下的代码: a {} a span {color: green;} a:hover {} a:hover span {color: red; } http://www.taobao.com“> 淘宝网 淘你喜欢 在IE7/FF中,鼠标移动到链接上时,”淘你喜欢”字样会变为红色,但IE6则无反应。所以IE6bug

wesxiaobao的专栏 447

ie6下用css来实现hover效果

<html> <head> <title>ie6hover效果的实现</title> <style> /* IE6中如果a与a:hover的css定义是一样的,也就是说如果a:hover中没有样式的改变,hover就不会被触...

weixin_30752699的博客 144

ie6常见css bug

IE6双倍边距bugIE6下如果某个标签使用了float属性,同时设置了其外补丁“margin:0 10px”可以看出,但第一个对象距左边有20px。 说明:这是因为块级对象默认的display属性值是block,当设置了浮动的同时,还设置了它的外边距 就会出现这种情况。也许你会问:“为什么第二个对象和第一个对象之间就不存在双倍边距的BUG”?因为浮动都有其相对应的对象,只有相对于其父...

weixin_33898233的博客 159

解决IE6兼容性问题常见方法

你对解决IE6兼容性问题常见方法是否了解,这里和大家分享一下,希望对你的学习有所帮助,欢迎大家一起来学习。 解决IE6兼容性问题常见方法 1、使用声明 你必须经常在html网页头部放置一个声明,推荐使用严格的标准。例如  "http://www.w3.org/TR/html4/strict.dtd”> or,forXHTML:   "http://www.w3.org/TR/xht

走在java的路途上 951

IE6中伪类:hover的使用及BUG

以前未曾遇到类似的问题,一番google,才知道这是IE6处理CSS伪类:hoverBug。例如如下的代码: <style>a {}a span {color: green;}a:hover {}a:hover span {color: red; }</style><a href=”http://www.taobao.com“> 淘宝网 <span&g...

weixin_30617797的博客 116

IE6的疯狂之八】链接伪类(:hover)CSS背景图片有闪动BUG

IE6下链接伪类(:hover)CSS背景图片有闪动BUG,主要原因ie会再一次请求这张图片,或者说图片没被缓存。 例如:   CSS代码     a:hover{background:url(imagepath)} 常用的解决方案:   在页面底部添加以下IE6专用代码,让IE6缓存CSS背景图片至本地,这样a:hoverIE6就不会再重新向服务器请求加载背景图片了。...

weixin_30349597的博客 77

【css】a:hover 设置上下边框在 ie6ie7 下失效

前段时间在写样式的时候发现了这个问题,虽然当时就解决了这个 bug 不过还是记录下,以免再次出现这样的问题。 demo 代码: &lt;!doctype html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"/&gt; &lt;meta http-equiv="X-UA-C

weixin_34209406的博客 80

万恶的 ie6 之 a:hover

工作中又碰到棘手的ie6问题。 在 ie7,ff中都正常,ie6中 a:hover竟然神奇的不管用了。再试了N种办法后,竟然发现在a:hover 上添加 background:none,竟然可以了。 上网搜了下,原来是: [url]http://www.w2blog.net/view/353.html[/url] 所以IE6bug就是如果a 与 a:hov...

alwayscode 175
上一篇: IE6.0输入框中文字垂直居中解决方案
下一篇: 全兼容的标准三级菜单
bennman
博客等级 码龄19年 31粉丝 41原创
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值