限制背景大小：包含原始图像大小

Question

我正在写一张相册，照片显示在使用以下CSS的页面覆盖div中：

.photoHolder {
    background-size: contain;
    background-image: url(theImage.jpg);
    background-position: 50% 50%;
    background-repeat: none;
    width: 100%;
    height: 90%;
    [...]
}

如果原始图像小于photoHolder的大小，则图像会拉伸并看起来很松散。有没有办法停止这个，而不使用JavaScript来限制div的大小？

照片尺寸当然可以变化，photoHolder的尺寸也可以变化（因为它占据了大部分可用窗口）。

Answer 1

您只需要删除

background-size: contain; 

导致背景图像拉伸。