Javascript 使全幅图像以div为中心

我有一个div容器，最大高度为400像素。我在容器内放置了一个相当大的图像。由于容器有一个最大高度，它明显地切断了大部分图片，这就是我的目标。但我唯一的问题是试图使图像在div内居中，因此显示了图片的主要部分

以下是我目前拥有的代码：

<div class="headerimg">
<img src="www.jpg.com"/>
</div>

.headerimg { max-height: 400px; overflow: hidden; }
.header img { width: 100%; height: auto; }

.headerimg{最大高度：400px；溢出：隐藏；}
.header img{宽度：100%；高度：自动；}

尝试使用：

div.container {
    margin: 0 auto;
    width: 900px;
}
div.container img {
    max-height:400px;
}

---

简单使用：文本对齐：居中

---

发布你的代码并展示你的尝试。水平居中还是垂直居中？（或者两者都有）？或者JSFIDLE可能很有用。试试这个方法@drew_w我想我们可以假设垂直，因为全幅图像是以定义为中心的。那里发生了什么？你看到JSFIDLE页面了吗？

div{
  max-height:400px;
  border:1px solid red;    
  text-align:center;
}
div img{
  height:500px;
  width:200px;
}