html - CSS - 居中图像并在顶部显示阴影

Question

我在具有 id 的 div 中有一个图像，container但它把事情搞砸了。它没有居中，而且图像上没有显示框阴影。我补充说margin:auto，但它没有帮助我。我认为margin:auto所有固定宽度的元素居中，但在我的例子中，你知道图像是由 CSS 调整大小的。还有其他解决方案吗？也许绝对定位有效，但容器高度将变为零。我不想使用 Javascript/jQuery。

我有这个垃圾桶给你！

Answer 1

使用margin:auto但还要添加display:block：

#container > img {
  max-width:100%;
  max-height:550px;
  height:auto;
 display: block;
  margin:auto;
}

更新：

如果您不希望图像超出阴影，请执行以下操作：

#container > img {
  max-width:100%;
  max-height:542px;
  height:auto;
  display:block;
  margin:4px auto 4px;
}

Answer 2

尝试 margin-left:auto margin-right:auto