IE CSS Bug系列:IE8中被忽略的:focus

伯乐在线导读:IE 浏览器不支持很多 CSS 属性是出了名的,即便在支持的部分中,也是有很多 Bug 的。Zoffix Znet 整理了 IE 中的 CSS 问题,有简单的问题示例,也有解决方法。 这个系列共有 58 个指南,70 个解决方案。这篇由伯乐在线前端开发小组的@nighca 翻译。(欢迎更多前端开发朋友来加入“前端开发小组。)

【提示】:IE CSS BUG 系列译文正在进行中,后续或有改动和调整,请不要转载本系列的译文。

—————————————————————————–

影响的IE版本

这个bug影响IE8

表现

包含:focus且其后跟随另一个简单选择器的选择器所对应的CSS规则会被忽略

教程编写时间

2009.8.13 15:26:51

描述

这个bug在你使用一个带:focus的选择器,且其后接了另一个简单选择器(这俩可能是由某个连接符连接,如子元素选择器)的时候出现。结果是这样的选择器对应的的规则会被忽略掉。我们来看一下:

演示

由于bug的性质,演示在一个单独的页面

HTML代码:

CSS 代码:

在正常的浏览器中,通过点击使button获得焦点将导致 <p> 元素 的文字变粗变大。IE8中 则不会——这个规则集被忽略了。

 

解决方案

以下是上述bug的解决方法(以类型排序)

解决方法 (简洁方法)

 

该方法的时间

2009.8.13 15:31:20

可修复的的版本

所有受该bug影响的版本

描述

这个解决方法干净彻底,这里是修复bug的演示:

由于bug的性质,修复bug的演示在一个单独的页面

HTML 代码:

CSS 代码:

我们通过添加一个额外的,使用:focus选择器的规则集来实现恢复“常态”。实际的规则集可以为空,不影响这个bug的修复。

收藏 评论

关于作者:nighca

(新浪微博:@nighca) 个人主页 · 我的文章 ·   

相关文章

可能感兴趣的话题



直接登录
跳到底部
返回顶部