Browser 你如何在Firefox和IE中集中一个div？_Browser_Html_Overlay_Center

Browser 你如何在Firefox和IE中集中一个div？

browser html

Browser 你如何在Firefox和IE中集中一个div？,browser,html,overlay,center,Browser,Html,Overlay,Center,我正在使用以下代码： <html> <body bgcolor="black"> <center> <div style="width:1080px;height:288px;"> <img src="declined.png" width="1080" height="288" alt="" style="z-index:0;position:absolute;" ondragstart="return false"/> <im

我正在使用以下代码：

<html>
<body bgcolor="black">
<center>
<div style="width:1080px;height:288px;">
<img src="declined.png" width="1080" height="288" alt="" style="z-index:0;position:absolute;" ondragstart="return false"/>
<img src="cover.png" width="1080" height="288" alt="Declined."" style="z-index:1;position:absolute;" ondragstart="return false" />
</div>
</center>
</html>

它可以在Chrome上运行，但不能在IE或Firefox上运行。我的目标是将cover.png覆盖在defeeded.png上，这样人们就不能直接保存图像，而是保存一个透明的png。我更喜欢在不使用外部CSS的情况下执行此操作。谢谢你的帮助。：）

css中的标准方法是使用

margin:0 auto

，因此：

<div style="width: 1080px; height: 288px; margin: 0 auto; position: relative">
   <img ... >
   <img ... >
</div>

注意添加了

位置：相对。否则，图像将绝对相对于元素定位。还请注意，任何对HTML和/或基本浏览器开发工具稍有了解的人都无法绕过这些类型的覆盖。请避免使用旧标记，如CSS。
-使用适当的DOCTYPE（下面的示例显示了html5的DOCTYPE）
-始终关闭标记，您的代码没有正文的关闭标记
<!DOCTYPE HTML>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <div id="main" style="width:1080px;height:288px;">
        <img src="declined.png" width="1080" height="288" alt="" style="z-index:0;position:absolute;" ondragstart="return false"/>
        <img src="cover.png" width="1080" height="288" alt="Declined."" style="z-index:1;position:absolute;" ondragstart="return false" />
    </div><!-- end div main -->
</body>
</html>

为什么img
位置是绝对的？如果没有这个，cover.png就不会被拒绝。我只是偷懒，没有复制整个东西，因为重要的一点是你在
#main{
    margin: 0 auto;
    width:1080px;
   height:288px; 
}