Css 使用stellar.js的移动设备上无法正确显示背景图像
大家好,我正在使用stellar.js,它在桌面设备上运行得非常好。但在移动设备上,背景图像只会显示其中的一部分。它不是显示整个图像,而是显示图像的左角。问题一定是css代码。但我没看到。谢谢你们的帮助 我的css看起来像:Css 使用stellar.js的移动设备上无法正确显示背景图像,css,mobile,background-image,stellar.js,Css,Mobile,Background Image,Stellar.js,大家好,我正在使用stellar.js,它在桌面设备上运行得非常好。但在移动设备上,背景图像只会显示其中的一部分。它不是显示整个图像,而是显示图像的左角。问题一定是css代码。但我没看到。谢谢你们的帮助 我的css看起来像: .intro-section { padding: 150px 0px; text-align: center; background-attachment: fixed; width:100%; height:100%; p
.intro-section {
padding: 150px 0px;
text-align: center;
background-attachment: fixed;
width:100%;
height:100%;
position: relative;
background-position: center center;
background-size: cover;
background-image: url(../images/frederick_meseck_wood_logo.png);
background-repeat: no-repeat;
}
@media(min-width:768px) {
.intro-section {
min-height: 100%;
}
}
在媒体查询中尝试以下操作:
@media(min-width:768px) {
.intro-section {
background-attachment: inherit !important;
background-size: 100% 100%;
background-repeat: no-repeat;
}
}
第一个背景大小参数是宽度,您可以在使用较小的设备时增加此值(我建议使用此参数)在媒体查询中尝试以下方法:
@media(min-width:768px) {
.intro-section {
background-attachment: inherit !important;
background-size: 100% 100%;
background-repeat: no-repeat;
}
}
第一个背景尺寸参数是宽度,在使用较小的设备时,可以增加该值(我建议这样做)