javascript - 中心动态高度/宽度图像到固定高度/宽度 div

Question

我在将动态图像居中到固定大小的 div 时遇到问题。因此，主要思想是图像知道如何缩放自己，无论是全景图像还是肖像图像。我对齐的 div 接近 16:9 (300x170)。有什么想法吗？

Answer 1

试试这个 - DEMO

div {
    height: 170px;
    width: 300px;
    border: solid;
    line-height: 170px;
    text-align: center;
}

div img {
    display: inline-block;
    max-width: 300px;
    max-height: 170px;
    vertical-align: middle;
}