为什么我的图像不在我的 DIV 中居中？答案

【问题标题】：Why is my image not centered in my DIV?为什么我的图像不在我的 DIV 中居中？
【发布时间】：2011-12-22 12:00:34
【问题描述】：

我必须承认，我对 HTML 的了解并不多，但我正在努力学习。我有一个以 DIV 为中心的图像，但它并没有真正水平居中。它的左边缘是中心所在的位置，如下所示：

[----------|----------]

[----------|图片--]

[----------|----------]

做什么，做什么……

编辑一些代码：

<style>
#Outer {
position:relative;
height:100%;
width:100%;
text-align: center;
}

#Picture {
position:fixed;
top: 30%;

}
</style>

另外，我将它垂直和水平居中。垂直工作正常。

【问题讨论】：

能贴出代码、HTML 和 CSS 吗？
真的需要代码，看看需要做什么。
好的，我添加了一些可能有用的代码

标签： html html5-video center centering

【解决方案1】：

你可以像这样简单地做到这一点。 :)

<div style="margin:auto;">
      <img src="" id="" />
</div>

【讨论】：

【解决方案2】：

在图像上设置一个宽度，然后将图像上的边距设置为 0px 自动。

<!-- Your HTML -->
<img src="path_to_image.jpg" alt="set alternate text" id="img_id" />

/* Your CSS: */
#img_id {
width: set the width of the image in pixels here (i.e. 250px);
margin: 0px auto;
}

【讨论】：

【解决方案3】：

您可以尝试将位置更改为相对位置。（见http://jsfiddle.net/VLCqz/1/）

至于为什么……

【讨论】：

【解决方案4】：

我也只是在学习 html，但我发现使用类似的东西

#picture
{
    margin-left:auto;
    margin-right:auto;
}

将 div 或任何样式位于父 div 的中间

希望对你有帮助

【讨论】：

【解决方案5】：

这可能有多种原因，请发布您的 html 和 css 代码以获得更好的答案。

应该在css中将parent text-align属性设置为center。 (see demo)

【讨论】：