带来一篇CSS教程:兼容ie6,ie7,ff的fixed
网上冲浪无论你用InternetExplorer还是NetscapeNavigator，几乎随时都在与CSS打交道，在网上没有使用过CSS的网页可能不好找。网页制造Poluoluo文章简介：兼容ie6,ie7,ff的fixed,元素高低端流动定位办法.
效果地点：
lt;!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><title>fixedie6</title><styletype="text/css">body{background-image:url(about:blank);background-attachment:fixed;/*需要，防发抖*/}.head,.foot{position:fixed!important;/*ie7ff*/position:absolute;z-index:21;background:#999;height:30px;width:500px;}.foot{bottom:0!important;/*ie7ff*/}.main{height:2000px;}</style><!--><styletype="text/css">/*ie6fix顶端元素*/.head{top:expression(eval(document.documentElement.scrollTop));}/*ie6fix底端元素*/.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><!--></head><body><divclass="head">header</div><divclass="main"><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p></div><divclass="foot">foot</div></body></html>
出处：http://xiebiji.com/2009/09/fixed
为了兼容ie6(万恶的器材),用的是expression的办法
在页头到场：
<styletype="text/css">body{background-image:url(about:blank);background-attachment:fixed;/*需要，防发抖*/}.head,.foot{position:fixed!important;/*ie7ff*/position:absolute;z-index:21;background:#999;height:30px;width:500px;}.foot{bottom:0!important;/*ie7ff*/}.main{height:2000px;}</style><!--><styletype="text/css">/*ie6fix顶端元素*/.head{top:expression(eval(document.documentElement.scrollTop));}/*ie6fix底端元素*/.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><!-->HTML:
<body><divclass="head">header</div><divclass="main"><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p>
<p>main</p><p>main</p>
<p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p>
<p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p>
<p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p>
<p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p><p>main</p></div><divclass="foot">foot</div></body></p>
对相应的代码做一些简单的修改，就可以改变同一页面的不同部分，或者页数不同的网页的外观和格式。 Dreamweaver在所见即所得添加链接时，可以在选中文字后在属性栏中的链接栏中直接输入文件的地址即可。 Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。 直接用代码建立链接，如：可以直接输入 <a herf = \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"red.html\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\">红色的网页 12、插入标签法建立链接，可以再选中文字后在代码中插入html标签，页元素<a>.也可以按ctrl+t进入html标签插入方法之后输入代码即可。 还可以在Dreamweaver常用工具中选择超级链接，完成相应的填写即可。 足见市场的反响和MACROMEDIA公司对它们的自信。说到Dreamweaver8我们应该了解一下网页编辑器的发展过程，随着互联网(Internet) 的家喻户晓。 俗话说：兴趣是最好的老师。做每一件事都离不开兴趣的驱动。兴趣是自学技术需要迈出的第一步。在学习的过程中，我们难免会遇到各种各样的问题。 这个过程其实就是交流的过程。所有的这些都需要花时间。在面对完全陌生的软件时，就要多花时间对其产生初步的印象。此外，多操作也是非常重要的。 俗话说：兴趣是最好的老师。做每一件事都离不开兴趣的驱动。兴趣是自学技术需要迈出的第一步。在学习的过程中，我们难免会遇到各种各样的问题。
页:
[1]