我有一个固定的位置标记,在我的CSS中样式如下:
#facebook {
height: 249px;
width: 50px;
position: fixed;
left: 0px;
top: 200px;
}
Run Code Online (Sandbox Code Playgroud)
我的网站上有一个flash(.swf)标题图像,当浏览器的分辨率足够低时,facebook div被闪存标题部分隐藏.
这是我的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>
Run Code Online (Sandbox Code Playgroud)
我怎么得到它所以我的Facebook固定位置div总是显示在这个.swf内容之上?
提前致谢
乔恩
使用CSS样式z-index
设置元素的垂直顺序.并给它一个足够高的值,所以它总是显示在顶部:
#facebook {
height: 249px;
width: 50px;
position: fixed;
left: 0px;
top: 200px;
z-index: 100;
}
Run Code Online (Sandbox Code Playgroud)
元素通常根据其自然HTML流程进行渲染(以简化它和在垂直排序方面).因此,后来定义的元素将在之前的元素上呈现