html - 为什么背景图像在移动设备上不会改变?
问题描述
html {
margin: 0;
padding: 0;
background-image: url("./Images/mainPage.png");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;
}
@media only screen and (max-width: 750px) {
html {
background-image: url("./Images/smalMainPage.png");
}
}
没有“@media only...”的部分适用于屏幕尺寸小于 750 像素的设备。为什么会这样?
解决方案
<meta name="viewport" content="width=device-width, initial-scale=1.0">
标签可能丢失?因为在 codepen 上工作:https ://codepen.io/dgknca/pen/REwKrV
推荐阅读
- visual-studio-code - VSCode扩展开发:如何获取一个类型的定义文件?
- algorithm - 在迷宫求解中同时结合 DFS 和 BFS 有意义吗
- python - 如何在字典中显示多个项目?
- ios - react-native-push-notification-ios - 方法声明缺少上下文
- c++ - 为什么 bool(val) 比 val.operator bool() 更喜欢双重隐式转换?
- pandas - DataFrame 属性无法识别
- java - 如何在 for 循环中添加 try catch 块以捕获 ArrayIndexOutOfBounds 异常?
- c# - EF Core - SaveChanges 上没有数据库更新
- c++ - 如何在 C++ 中使用十六进制颜色代码制作颜色查找功能
- mysql - db 中表的第一行的元素返回:列名和两个破折号以及它的值