HTML嵌入标签覆盖了导航栏中的div标签

Question

我正在为计算机网络课程设计一个静态网站。 学生可以从网站上下载PDF格式的家庭作业文件，我使用embed标签在线显示文件，问题是embed元素总是覆盖导航栏中的div标签，z-index css属性没有用。，有没有人可以提供一些有用的方法来解决此问题？谢谢！

我的导航栏HMTL是：

<div id="Navsun"><a href="NewCourseIntr.html">CourseIntroduction</a>
      <div id="secondnav">
       <ul id="menu">
         <li><a href="Team.html" class="subsun">Team</a></li>          
         <li><a href="TeachFundation.html" class="subsun">Foundation</a></li>
         <li><a href="TeachContent.html" class="subsun">Content</a></li>
       </ul>
      </div>
   </div>

我的CSS代码是：

#Navsun:hover #secondnav
{
    display:block;
    z-index:100;/*change the z-index value to avoid covered by embed or flash element*/
}

embed元素是：

<div id="pdfDiv">
<embed width="99%" height="510px;" src="homework1.pdf" id="PdfShow1" type="application/pdf" style="margin-left:2px;display:block;"/>
</div>

我的HTML文件的概述是：

<!DOCTYPE html>
<html>
<head>
<title>Computer Networks</title>
</head>
<body>
<div id="nav">
 <!--Navigation bar is here-->
</div>
<div id="pdfDiv">
<embed width="99%" height="510px;" src="homwork1.pdf" id="PdfShow1" type="application/pdf" style="margin-left:2px;display:block;"/>
</div>
<div id="footer">

</div>
</body>
</html>

结果是这样的： 在此处输入图片说明

Answer 1

您可以将PDF文档嵌入到iframe中，并将ifram放在div中/旁边。 这将使您可以控制div。 这是一个示例， http://www.cs.tut.fi/~jkorpela/html/iframe-pdf.html

HTML嵌入标签覆盖了导航栏中的div标签

问题描述

1 个解决方案

解决方案1
1 2013-11-26 07:37:14

HTML嵌入标签覆盖了导航栏中的div标签

问题描述

1 个解决方案

解决方案1 1 2013-11-26 07:37:14

解决方案1
1 2013-11-26 07:37:14