css - 固定位置 Div 总是出现在顶部?

标签 css html

我的 CSS 中有一个固定位置标签,其样式如下:

#facebook {
height: 249px;
width: 50px;
position: fixed;
left: 0px;
top: 200px;
}

我的网站上有一个 flash (.swf) 标题图片,当浏览器的分辨率足够低时,facebook div 会被 flash 标题部分隐藏。

这是我的 HTML:

 <body id="index">
 <div id="facebook"><img src="images/facebook.png" width="50" height="249" border="0"      usemap="#Map" />
 <map name="Map" id="Map">
 <area shape="rect" coords="2,154,40,191" href="http://www.youtube.com/" />
 <area shape="rect" coords="3,202,39,240" href="http://www.facebook.com/group.php?gid=72781675198" />
 </map>
 </div>
 <div id="wrapper">
 …
   <div id="title_box"><object type="application/x-shockwave-flash" 
    data="images/flash.swf" 
    width="960" height="450">
 <param name="movie" value="images/flash.swf" />
 <img src="images/header.jpg" />
 </object></div>

如何才能让我的 facebook 固定位置 div 始终显示在此 .swf 内容之上?

提前致谢

乔恩

最佳答案

z-索引

使用 CSS 样式 z-index 设置元素的垂直顺序。并赋予它足够高的值,以便它始终显示在顶部:

#facebook {
    height: 249px;
    width: 50px;
    position: fixed;
    left: 0px;
    top: 200px;
    z-index: 100;
}

元素通常根据其自然的 HTML 流程呈现(以简化它和垂直排序)。因此,后来定义的元素会呈现在先前的元素之上。

关于css - 固定位置 Div 总是出现在顶部?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5702050/

相关文章:

css - 解释这个 CSS 自定义属性行为

CSS tiles 大小调整

jquery - 用$.ajax 提交表单是否矛盾?

javascript - 是否可以在 HTML 标记中插入您的属性?

html - 如何让 Bootstrap 容器与另一个 div 保持内联?

javascript - 为任何聚焦元素触发按键点击事件

HTML div 居中

jQuery this() 循环问题

javascript - 如何使用JS将选中的数据从表格的一行传递到另一个页面

php - 有语法错误但不知道在哪里