2007-05-02

跨浏览器的CSS固定定位

来源: 本站收集整理 作者:佚名 评论 0 条
 

跨浏览器的CSS固定定位{position:fixed}

不知道您是否留意了,浏览本站时,浏览器右下角有一个标着top的黑色直角三角形,可以点击它返回到正在浏览的网页页眉。当滚动网页时,它的位置一直没有任何改变,您感觉它怎么样?这就是通过CSS的定位属性{position:fixed}来实现的,通过它可以让HTML元素脱离文档流固定在浏览器的某个位置。

  1. IE7、Firefox、Opera,都支持CSS的{position:fixed},所以很轻易实现
  2. IE6不支持该属性,但是在使用!DOCTYPE 声明指定standards-compliant(标准)模式可以通过CSS hack实现
  3. 上述声明下IE5和IE5.5目前没有发现通过纯粹CSS能够解决的方案,但是可以通过IE特有的expression在CSS中实现(移动网页时固定元素会动),这和常见浮动Logo广告利用Javascript实现原理是一样的,只不过可以直接写在CSS中比较简便的
  4. 利用IE独有的条件注释语句可以针对不同的IE版本精确设置,同时避免了这些代码被其他浏览器读到,个人认为比纯粹的CSS Hack好,假如你安装了多个IE(包括绿色版本),条件注释将会以最高版本的IE为标准。

现代码如下:

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

……

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


(本文仅表明作者个人观点,不代表本站及其管理员立场.) 推荐 收藏 投稿 打印 返回 关闭
上一篇:网页导航上用CSS标志当前页效果的实现  
下一篇:理解CSS的浮动元素建立更好网站
    评论加载中…
 推荐文章
     

网站首页  -  网站地图 -   站长论坛  -  网站投稿  -    -  网站管理
Copyright © 2008 芜湖站长站 All Rights Reserved 皖ICP备07500611号