如何在 Firefox 和 IE 中将 div 居中?
我正在使用以下代码:
<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 覆盖到 returned.png 上,这样人们就不能直接保存图像,而是保存透明的 png。我更喜欢在不使用外部 CSS 的情况下执行此操作。感谢您的帮助。 :)
I'm using the following code:
<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>
It works in Chrome but not in IE or Firefox. My goal with this is to overlay cover.png over declined.png so people cannot directly save the image, but instead save a transparent png. I prefer to do this without using external CSS. Thanks for your help. :)
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
css中的标准方法是使用
margin: 0 auto
,所以:注意添加
position:relative
。如果没有它,您的图像将绝对相对于元素定位自己。另请注意,任何对 HTML 稍有了解和/或访问基本浏览器开发工具的人都可以轻松绕过这些类型的覆盖。
The standard method in css is to use
margin: 0 auto
, so:Note the addition of
position: relative
. Without that, your images would position themselves absolutely relative to the<body>
element. Also note that these sorts of overlays are trivial to bypass by anyone with the slightest knowledge of HTML and/or access to basic browser developer tools.- 避免使用旧标签,例如使用 CSS。
-使用适当的DOCTYPE(下面的示例显示了html5的doctype)
- 始终关闭您的标签,您的代码没有正文的结束标签。
CSS:
-Avoid using old tags such as instead use CSS.
-Use appropriate DOCTYPE (example below shows doctype for html5)
-Always close your tags, your code does not have closing tags for body.
CSS: