我的 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/