我试图在 StackOverflow 上找到类似的问题，但只能找到与 Flash 对象相关的问题。
我尝试使用以下代码和所有三个标签(iframe、对象和嵌入)将 div 定位在嵌入对象的顶部:
<html>
<head>
<style>
.overlay {
background:#FFFFFF;
border:1px solid #000000;
padding:30px;
position:absolute;
top:20px;
left:50%;
width:100px;
margin-left:-50px;
z-index:99;
}
.wrapper {
text-align:center;
background:#F00;
padding:20px;
position:relative;
z-index:2;
}
</style>
</head>
<body>
<div class="overlay">Overlay DIV</div>
<div class="wrapper">
<embed width="100%" height="100%" src="http://www.foxitsoftware.com/resources/pdf/Datasheet_Reader.pdf" frameborder="0"></embed>
<!--<object width="100%" height="100%" data="http://www.foxitsoftware.com/resources/pdf/Datasheet_Reader.pdf" frameborder="0"></object>-->
<!--<iframe width="100%" height="100%" src="http://www.foxitsoftware.com/resources/pdf/Datasheet_Reader.pdf" frameborder="0"></iframe>-->
</div>
</body>
</html>
它适用于最新版本的 Firefox 和 Chrome，但不适用于 IE9。我需要它在 IE8 和更高版本中工作。
是否可以在 IE8+ 中执行所有操作？
最佳答案
您可以在叠加层下放置一个 iframe。 http://jsfiddle.net/emn178/64XeK/
<style>
iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
</style>
<div class="overlay">Overlay DIV<iframe frameborder="0"></iframe></div>
这是我找到的最好的方法。
关于html - DIV 在嵌入文档上的绝对定位，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23001435/