自动边距不会使页面中的图像居中 [英] Auto margins don't center image in page

问题描述

在此示例中，图片不居中。为什么？我的浏览器是Windows 7（而不是IE）上的Google Chrome v10。

In this example the image is not centered. Why? My browser is Google Chrome v10 on windows 7, not IE.

<img src="/img/logo.png" style="margin:0px auto;"/>

推荐答案

add display： ，它会工作。默认情况下，图片是内嵌的

add display:block; and it'll work. Images are inline by default

为了说明，块元素的默认宽度为

To clarify, the default width for a block element is auto, which of course fills the entire available width of the containing element.

通过将边距设置为 auto / code>，浏览器将剩余空间的一半分配给 margin-left ，另一半分配给 margin-right 。

By setting the margin to auto, the browser assigns half the remaining space to margin-left and the other half to margin-right.

这篇关于自动边距不会使页面中的图像居中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！