目前,图片正在一个具有给定宽度和高度的div容器中放入我的网站.
有些图片是风景,有些是肖像.
目前,我使用CSS为图像提供静态宽度和高度,以便在其容器内正确定位.
.winner .winner-image img {
height: 159px;
width: 143px;
}
Run Code Online (Sandbox Code Playgroud)
然而,经常注意到这会扭曲图片.
在不扭曲图像的情况下显示图像的推荐方法是什么?最佳做法?
如果没有一些服务器端代码来实际确定图像的高度和宽度,最好的想法是设置EITHER的高度或宽度,但不能同时设置两者.这将导致图像按比例调整大小.您选择约束的维度取决于您的网站布局.