解决IE6、IE7、Firefox兼容最简单的CSS Hack

2016-02-19 17:46 3 1 收藏

下面是个超简单的解决IE6、IE7、Firefox兼容最简单的CSS Hack教程,图老师小编精心挑选推荐,大家行行好,多给几个赞吧,小编吐血跪求~

【 tulaoshi.com - Web开发 】

很早就在这里看到过解决方案,与嗷嗷讨论后发现这个方案还是很可靠的。当然,唯一的缺点就是每一个属性都要去Hack,但我在很多实践中,只用‘修正’1-2个属性就可以了。

具体写法很容易:

#someNode
{
    position: fixed;
   #position: fixed;
   _position: fixed;
}
第一排给Firefox以及其他浏览器看

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

第二排给IE7(可能以后的IE8、IE9也是如此,谁知道呢)看

第三排给IE6以及更老的版本看

最好的应用就是可以让IE6也“支持”position:fixed,而且,配合这个原理,可以做到不引入JavaScript代码(仅用IE6的expression),我这里有一个现成的页面,CSS如下写:

#ff-r
{
 position:  fixed;
_position:  absolute;
 right:     15px;
 top:       15px;
_top:       expression(eval(document.compatMode &&
            document.compatMode=='CSS1Compat') ?
            documentElement.scrollTop+15 :
            document.body.scrollTop +
            (document.body.clientHeight
            -this.clientHeight));
}
是不是很方便:)

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

来源:https://www.tulaoshi.com/n/20160219/1616033.html

延伸阅读
标签: Web开发
基本HTML代码 !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"html xmlns="http://www.w3.org/1999/xhtml" headtitleDiv Float Sample/titlestyle type="text/css"div { margin:3px; }.d1 { width:250px; min-height:...
标签: Web开发
1、仅 Safari 和 Opera 识别的 Hack @media all and (min-width: 0px) {/* Safari and Opera  rules here *
标签: Web开发
js用来区别IE与其他浏览器及IE6-8之间的方法。 1、document.all 2、!!window.ActiveXObject; 使用方法如下: if (document.all){ alert(IE浏览器); }else{ alert(非IE浏览器); } if (!!window.ActiveXObject){ alert(IE浏览器); }else{ alert(非IE浏览器); } 下面是区别IE6、IE7、IE8之间的方法: var isIE=!!window.ActiveXObject; v...
标签: Web开发
IE7 修复了很多 bug,也增加了对一些选择符的支持,所以现在诸如 *html {} 和 htmlbody {} 等针对 IE 隐藏或显示的 hack 都会在 IE7 中失效。虽然 CSS Hack 不推荐使用,条件注释才是万无一失的过滤器,但是条件注释只能出现在 HTML 中,CSS Hack 还是有用武之地的。Nanobot 发现了一些针对 IE7 的 CSS Hack,具体就是: body html* *+html ...
标签: Web开发
meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" / 记录一下备用。

经验教程

662

收藏

70
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部