html - 将 div 在其他 div 内居中对齐，并将图像垂直和水平居中对齐

Question

我正在尝试实现以下目标：我在页面的中心有一个中心 div（包装器），无论是垂直还是水平。在那个 div 里面我想要另外 2 个 div，其中一个将包含一个徽标，另一个将包含一些文本。徽标图像还必须垂直和水平对齐到其 div 的中心。目前这就是我所拥有的：

这是我的 HTML 和 CSS 的 jsfiddle：http: //jsfiddle.net/7cQhG/

如何使徽标 div 居中（仅水平居中，顶部边距为 10px），并使徽标图像在该 div 内居中，水平和垂直，就像现在一样）？

Answer 1

有什么理由必须将徽标作为 img 吗？

我已经采取了你给的起点，并把一个 jsFiddle 叉子放在一起：http: //jsfiddle.net/mori57/HDmkZ/

我取出了 img 标签，并将其用作背景图像。“中心中心”理论上应该在其容器内居中，并且由于它是透明的 png，因此您的背景颜色仍会按您的意愿显示。

让我知道这是否适合您，或者如果您有任何其他问题。

作为一个侧边栏，你真的不需要（你真的不应该）在你的 CSS 中指定你的标签。唯一真正合适的地方是如果您将默认值分配给特定标签......否则，当您使用那里的那些 ID 时，特异性规则已经开始接管。

请注意，我不清楚您想对徽标下方的文本做什么，所以我没有做任何样式。