使用CSS调整图像大小和居中

Question

我的情景：

• 我的图片大小为1900 x 1600像素。
• 我的div大小为200 x 150像素。

我使用以下CSS调整了图像大小：

max-width:300px;
max-height:300px;

高度将保持成比例，因此在本例中它将是252像素。

如何将图像置于div中心？我的意思是：

background-position: center center;

使用CSS 2可以做到这一点吗？

Answer 1

你的意思是

background:url("test.png");
background-size: 300px auto;
background-position: center center;

Answer 2

要将DIV置于元素中心，您可以设置width和margin，左右边距设置为自动：

div { margin: 0 auto; width: 300px; }