作家
登录

跨浏览器的CSS固定定位

作者: 来源:www.28hudong.com 2012-11-19 22:46:31 阅读 我要评论

本文介绍了跨浏览器的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选择符(selectors)是远远不够的。还在于对工作的整体规划,工作流程的掌握以及提高样式表的可维护性和效率。在这篇文章里Jina Bolton从12个顶尖设计师那里精选出了10种>>>详细阅读


本文标题:跨浏览器的CSS固定定位

地址:http://www.17bianji.com/kaifa2/CSS/17165.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)