如何将未知宽度的图像居中？

Question

使用CSS如何将未知尺寸的图像居中？

Answer 1

水平

img {display:block; margin: 0 auto}

或

.container {text-align:center}

垂直

/* container must contain some text as well */
.container, img {line-height:100px; vertical-align:middle}

或

.container {display:table-cell; vertical-align:middle}

如果图像只是装饰性的：

.container {background: url(…) 50%;}

Answer 2

将图片视为原生inline-block元素（我认为 - 至少不是block），

text-align: center 

周围容器的

将完成这项工作。

Answer 3

您可以像这样使用CSS：

img { display: block; margin: 0 auto; }