我试图在不压缩任何图像的情况下,将三个宽度不同的图像设为相同的高度。图像具有相同的高度。我真的被卡住了!任何帮助将非常感激。
这是jsfiddle
https://jsfiddle.net/5Lbuxawg/
<style>
.shopi {
width:100%;
display: flex;
flex-direction: row;
align-items: flex-start;}
.shopi img {
width:auto;
height:100%;
}
.shopichild {width:100%;object-fit:contain;}
</style>
<body>
<div class="shopi">
<div class="shopichild "><img src="https://cdn.shopify.com/s/files/1/1640/3713/files/h1_400x.jpg" alt="natural" /></div>
<div class="shopichild "><img src="https://cdn.shopify.com/s/files/1/1640/3713/files/h2_400x.jpg" alt="natural" /></div>
<div class="shopichild "><img src="https://cdn.shopify.com/s/files/1/1640/3713/files/h3_600x.jpg" alt="natural" /></div>
</div>
Run Code Online (Sandbox Code Playgroud)
谢谢