CSS教程:兼容ie6,ie7,ff的fixed

2016-02-20 00:07 5 1 收藏

在这个颜值当道，屌丝闪边的时代，拼不过颜值拼内涵，只有知识丰富才能提升一个人的内在气质和修养，所谓人丑就要多学习，今天图老师给大家分享CSS教程:兼容ie6,ie7,ff的fixed，希望可以对大家能有小小的帮助。

【 tulaoshi.com - Web开发】

效果地址：

!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"headmeta http-equiv="Content-Type" content="text/html; charset=utf-8" /titlefixed ie6/titlestyle type="text/css"body{background-image:url(about:blank); background-attachment:fixed;/*必要，防抖动*/}.head,.foot{position:fixed !important;/*ie7 ff*/position:absolute;z-index:21;background:#999;height:30px;width:500px;}.foot{bottom:0 !important;/*ie7 ff*/}.main{height:2000px;}/style!--[if IE 6]style type="text/css"/*ie6 fix顶端元素*/.head{top:expression(eval(document.documentElement.scrollTop));}/*ie6 fix底端元素*/.foot{top: expression(eval((document.compatMode&&document.compatMode=="CSS1Compat")？documentElement.scrollTop+documentElement.clientHeight-this.clientHeight-1:document.body.scrollTop+document.body.clientHeight-this.clientHeight-1));}/style![endif]--/headbodydiv class="head"header/divdiv class="main"pmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /p/divdiv class="foot"foot/div/body/html
[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

出处：

为了兼容ie6(万恶的东西),用的是expression的方法

在页头加入：

style type="text/css"body{background-image:url(about:blank); background-attachment:fixed;/*必要，防抖动*/}.head,.foot{position:fixed !important;/*ie7 ff*/position:absolute; z-index:21; background:#999;height:30px;width:500px;}.foot{bottom:0 !important;/*ie7 ff*/}.main{height:2000px;}/style!--[if IE 6]style type="text/css"/*ie6 fix顶端元素*/.head{top:expression(eval(document.documentElement.scrollTop));}/*ie6 fix底端元素*/.foot{top: expression(eval((document.compatMode&&document.compatMode=="CSS1Compat")？documentElement.scrollTop+documentElement.clientHeight-this.clientHeight-1:document.body.scrollTop+document.body.clientHeight-this.clientHeight-1));}/style![endif]--

HTML:

bodydiv class="head"header/divdiv class="main"pmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /ppmain /p/divdiv class="foot"foot/div/body

来源:http://www.tulaoshi.com/n/20160220/1631311.html

上一篇：省略密码输入步骤直接登录Windows 8系统
下一篇：如何对CSS Expression进行优化

看过《CSS教程:兼容ie6,ie7,ff的fixed》的人还看了以下文章更多>>

CSS教程:让IE6支持position:fixed

标签： Web开发

参与测试的浏览器：IE6 / IE7 / IE8 / FF3 / OP9.6 / SF3 / Chrome2 操作系统：Windows 我喜欢position:fixed，它很酷。但ie6总不支持它，所以用其他的属性来模拟（这个模拟在主流浏览器中都兼容，所以其他浏览器也不需要分开写position:fixed了）。看效果先：运行代码框 !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitiona...

JS区别IE6、IE7、IE8之间的方法

标签： 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...

让IE8兼容IE7

标签： Web开发

meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" / 记录一下备用。

CSS对IE6、IE7、IE8支持详细的易用的参考

标签： Web开发

中文原文：译自：关于浏览器的最离奇的统计结果之一就是 Internet Explorer 版本6，7和8共存。截至本文，。在网站开发社区，这个数字要小很多，统计显示。这些统计中比较有趣的部分是，IE6、IE7、IE8之间的数值很接近，这防止了单个Microsoft的浏览器占居统治地位与过去的情况相反。根据这些令人遗憾的统计结果，在为客户开发网站...

IE6/IE7和Firefox对Div处理的差异

标签： 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:...

查看更多精彩>>