gpt4 book ai didi

CSS : Background image not rescaling on mobile

转载 作者:太空宇宙 更新时间:2023-11-04 07:24:26 27 4
gpt4 key购买 nike

我不是编码员,但有一些基本知识并且一直在编辑模板。该网站几乎就在那里 - 在桌面上它看起来不错,但在移动设备上封面图片不会按比例缩小。

我已经尝试将大小从 100%、自动和封面更改为 vw 和 vh 等,但仍然无法正常工作。

这是 CSS:

.intro {
display: table;
height: auto;
width: auto; /* 100% originally */ .
padding: 0;
text-align: center;
color: #333;
background: url(../img/intro-bg.jpg) no-repeat center top;
background-color: #e5e5e5;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: auto;
-o-background-size: auto;
}

如果有人能提供帮助那就太好了!该网站是 adammillsmusic.com

谢谢!

最佳答案

对于响应式图片,在 .intro 类中执行以下操作

intro {
max-width: 100%;
height: auto;
display:block;
padding: 0;
text-align: center;
color: #333;
background: url(../img/intro-bg.jpg) no-repeat center top;
background-color: #e5e5e5;
background-size: contain;
-webkit-background-size: contain
}

主要变化

max-width: 100%;
height: auto;
display:block;

希望对你有帮助

关于CSS : Background image not rescaling on mobile,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50020470/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com