盒子A中有一个img,当A的宽度大于高度时,img的高度以A的高度为准, 当A的宽度小于高度时,img的高度以A的宽度为准

盒子A中有一个img,我的需求是,
当A的宽度大于高度时,img的高度以A的高度为准,
当A的宽度小于高度时,img的高度以A的宽度为准,
css能实现吗?

阅读 2.4k
2 个回答

通过给img设置如下css就可以:

height: 100%;
width: 100%;
object-fit: contain;
A{
 --width:200px;
 --height:100px;
 width:var(--width);
 height:var(--height);
}
img{
height:max(var(--width),var(--height));
}

这样是不是能满足你的需求。。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题