手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >跨浏览器的CSS固定定位
跨浏览器的CSS固定定位
摘要:本文介绍了跨浏览器的CSS固定定位,请看下面的例子:……#fixed{position:fixed;top:5e...

本文介绍了跨浏览器的CSS固定定位,请看下面的例子:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

……

<style type="text/css">

#fixed{position:fixed;top:5em;right:0;……} /*针对IE7、Opera、Firefox一行搞定*/

</style>

/*IE6中利用容器对溢出内容的处理方式来实现的*/

<!–[if IE 6]>

<style type="text/css">

html{overflow:hidden;}

body{height:100%;overflow:auto;}

#fixed{position:absolute;right:17px;}

/*fixed元素的绝对位置是相对于HTML元素来说,滚动条是body元素的,这是设置right:17px的原因*/

</style>

<![endif]–>

<!–[if lt IE 6]>

<style type="text/css">

#fixed{position:absolute;top:expression(eval(document.body.scrollTop 50));}

</style>

<![endif]–>

</head>

<body>

<div id="wrapper">

……

</div>

<div id="fixed"><h2>{position:fixed}</h2></div>

</body>

</html>

【跨浏览器的CSS固定定位】相关文章:

表格列表偶数列、奇数列的CSS样式示例

详解CSS的定位语法应用

Google浏览器CSS居中兼容问题完美解决方法

针对主流浏览器的CSS-HACK写法及IE常用条件注释

表格对决CSS

自动按时段切换网页的CSS风格

浅谈CSS编程的OOCSS和SMACSS设计模式

解决火狐浏览器按钮的水平居中

css div绝对定位与固定定位实例

CSS对浏览器的兼容性性处理(IE7,6与Fireofx)

精品推荐
分类导航