窗口拖动，图片缩放与垂直居中的问题
我最近在用electron框架，做一个漫画阅读器
现在遇到如下问题，
我想让我的阅读器，在单页模式显示时，
图片垂直居中显示，且尺寸不超出容器。
<div>
<img src="./image.png" alt="image" />
</div>
div {
display: flex;
align-items: center;
justify-content: center;
}
img {
max-width: 100%;
max-height: 100%;
}不拖拉窗口的时候，图片可以按照预期样子显示。
但是一旦拖拉窗口，图片就会发生变形。不过刷新之后，又回恢复正常。
如果改变dom结构，去掉，让图片作为div的背景显示的话，
可以解决拖动变形的问题，但切换图片时，会有的闪烁效果，刺瞎狗眼。
（ GIF 图片一直上传失败，看这里吧 ）
请问我该怎么做，既能防止图片变形，又不出现闪烁效果
展开
收起
1
条回答
写回答
写回答
-
IT从业img { max-width: 100%; max-height: 100%; object-fit: contain; }2019-07-17 19:30:59赞同 展开评论 打赏
问答分类：
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
相关问答
问答排行榜
最热
最新
推荐问答
