我有一张幻灯片的图像宽度为100%。图片为1600x380。 问题是,当我测试移动格式时,图像的高度很小。我需要仅在移动设备中将高度设置为更高。
我尝试设置高度和宽度,但是它显示了拉伸后的图像。
如何在不拉伸图像的情况下增加图像的高度?我想放大图片
答案 0 :(得分:0)
使用 object-fit ,例如:
docker run -e SERVER_PORT=9090 -p 9090:9090 messenger-auth-auth
答案 1 :(得分:0)
使用 @media查询来检测用户何时使用移动设备(或更小的屏幕,可以在此处找到更多信息:https://www.w3schools.com/css/css_rwd_mediaqueries.asp)。然后只需将图像的 width 属性设置为 auto 。我希望这就是您想要的。
答案 2 :(得分:0)
或者像个背景。
.img {
width: 100%;
height: 380px;
background-size: cover;
background-position: center;
display:block;
background-image: url('http://www.canalvie.com/polopoly_fs/1.1805232.1467990211!/image/chat-siamois.jpg_gen/derivatives/cvlandscape_670_377/chat-siamois.jpg');
}
<div class="img"></div>