如何在边界框中保持图像的宽高比 - CSS

Question

原谅我在这里严重缺乏知识，如果我没有正确指出事情我会道歉。我正在Weebly的一个网站上工作，我的徽标有问题。我上传的图片很大，它的盒子只有525像素×200像素。通过CSS中的以下信息，我只获得了我的徽标的顶角。如何使图像适应盒子的大小？谢谢。

#logo{
float: left;
background: transparent url(logotransparent.png)no-repeat;
width: 525px;
height: 200px;
}

Answer 1

你有2个职位：

background-size: cover;

或

background-size: contain;

第一个将覆盖所有区域，削减图像的某些部分。

第二个将使图像尽可能大而不切割图像

两者都将保持图像的宽高比。