CSS z-index问题,急急急!!!
上面是一个导航,下面是一个视频,然后导航那有二级菜单,显示的时候,总是显示在视频的下面,我非常的苦恼,给它们加了z-index也没有用,应该是我没加对吧,请各位高手赐教了,谢谢。
加了视频后的效果
没加视频的效果
<div id="menu">
<ul>
<li><a class="hide one" href="#" style="width:70px;">Home</a></li>
<li class=""><a class="hide" href="#" style="width:100px;">Faculty</a></li>
<li class=""><a class="hide two" href="#" style="width:100px;">Information</a></li>
<li><a class="hide" href="#" style="width:100px;">Program</a>
</li>
<li><a class="hide" href="#" style="width:150px;">Live Case Sites</a></li>
<li><a class="hide two" href="#" style="width:100px;">Submissions</a></li>
<li><a class="hide two" href="#" style="width:100px;">Exhibition</a></li>
<li><a class="hide one" href="#" style="width:60px;">China</a></li>
<li class=""><a class="hide" href="#" style="width:120px;">History Review</a>
<ul class="nav_l">
<li><a href="#" target="_blank">CIT2012</a></li>
<li><a href="#" target="_blank">CIT2011</a></li>
<li><a href="#" target="_blank">CIT2010</a></li>
<li><a href="#" target="_blank">CIT2009</a></li>
<li><a href="#" target="_blank">CIT2008</a></li>
<li><a href="#" target="_blank">CIT2007</a></li>
</ul>
</li>
</ul>
</div>
<div class="mv" style=" text-align:center;">
<!-- START OF THE PLAYER EMBEDDING TO COPY-PASTE -->
<object id="player" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" name="player" height="273" width="943">
<param name="movie" value="./css/player-viral.swf">
<param name="allowfullscreen" value="true">
<param name="allowscriptaccess" value="always">
<param name="flashvars" value="file=http://www.citmd.com/CIT/2013/images/cit2013.mov&image=./images/cit_video.jpg">
<embed type="application/x-shockwave-flash" id="player" name="player" src="Home-CIT%20Conference%202013_files/player-viral.swf" allowscriptaccess="always" allowfullscreen="true" flashvars="file=http://www.citmd.com/CIT/2013/images/cit2013.mov&image=./images/cit_video.jpg" height="273" width="964">
</object>
<!-- END OF THE PLAYER EMBEDDING -->
</div>
CSS HTML 视频 z-index
#menu { width:943px; height:38px; margin:0 auto; clear:both; position:relative; background:#000;}
#menu ul { list-style: none; margin: 0px; padding: 0px; width:943px; }
#menu ul li { float:left; background:url(../images/line.png) no-repeat right; height:38px;}
#menu ul li a { display:block; width:95px; height:38px; line-height:38px; text-align:center; font-size:13px; font-weight:bold;}
#menu ul li a#current { font-weight:bold; color:#fff;}
#menu ul li img {_margin:12px 0; _vertical-align: middle;}
#menu ul li a:hover { color:#d26105;}
#menu ul li ul { display:none; position:absolute; width:167px; border-left:none; margin-right:20px; background:#e1ecf8; filter:alpha(Opacity=90); Opacity:0.9;}
#menu ul li ul li { float:none; width:167px; margin:0; border-bottom:1px dashed #fff; background:none;}
#menu ul li ul li a { background:none; width:167px; color:#575757; font-size:12px;}
#menu ul li ul li a:hover { color:#000;}
#menu ul li:hover ul { display:block;}
#menu ul li.sfhover ul { display:block;}
.nav_l { right:-20px;}
*html .nav_l { right:-21px;}
<object id="player" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" name="player" height="273" width="943">
<param name="movie" value="./css/player-viral.swf">
<param name="allowfullscreen" value="true">
<param name="allowscriptaccess" value="always">
<param name="flashvars" value="file=http://www.citmd.com/CIT/2013/images/cit2013.mov&image=./images/cit_video.jpg">
<embed type="application/x-shockwave-flash" id="player" name="player" src="Home-CIT%20Conference%202013_files/player-viral.swf" allowscriptaccess="always" allowfullscreen="true" flashvars="file=http://www.citmd.com/CIT/2013/images/cit2013.mov&image=./images/cit_video.jpg" height="273" width="964">
</object>