来自CSS的图像比例

Question

如何从CSS缩放我设置宽度和高度的图像。目前，它看起来非常紧张。 这就是我在HTML中所做的：

<div id="notification-media" *ngIf="notification.type < 200">                            
   <img src="{{notification.video.thumbnail}}" id="notification-video-image"/>
</div>

在我的CSS文件中：

#notification-video-image{
    width: 96px;
    height:54px;
    margin-top: 30px;
}

 #notification-media{
     width: 30%;
     float: right;
     margin-right: 18px;
 }

我也试图设置background-size:cover和width:100%; , height:100%;，但它并没有让我达到预期的效果。

Answer 1

将width或height设置为auto。

#notification-video-image{
    width: 96px; // auto or
    height:54px; // auto
    margin-top: 30px;
}