这是firefox开发中的版本:
这是真实手机中的屏幕复制:
(请注意,女孩照片上方的动画gif很好)
这是css:
.img_mobile {
margin:auto;
width: 100%;
max-width: 100%;
height: auto;
}
#conteneur {
display:flex;
flex-direction: row;
justify-content: center;
}
这是HTML的一部分:
<div class="img_mobile" id="conteneur">
<img src="{% static 'img/home/img-mobile-01.jpg' %}?{{ git_last_commit }}" alt="">
<img src="{% static 'img/home/animation-image-1.gif' %}?{{ git_last_commit }}" alt="" style="position:absolute; mix-blend-mode: screen;">
</div>
2个问题:
感谢您的帮助
答案 0 :(得分:0)
尝试
.img_mobile {
margin:auto;
width: 100%;
max-width: 100%;
height: auto;
object-fit: cover;
}
答案 1 :(得分:0)
好的,我找到了解决方案:
class =“img_mobile”应该在img标签内
但我仍然想知道为什么这个错误无法通过firefrox开发工具检查...所以如果有人知道如何测试移动页面......