我有一个移动版的wordpress主题。但是,当我上平板电脑时,会显示我的网页版本,当我上平板电脑时,我设置分辨率以进入移动版本?
非常感谢
答案 0 :(得分:0)
更改主题断点的问题在于每个主题都以不同的方式设置它们,因此没有通用的解决方案,但是您可以指向正确的方向。
准确追踪移动断点来源的最简单方法是将浏览器缩小到移动设备尺寸,并使用开发人员工具检查已调整大小的元素。选择一个元素并在检查器中查找应用媒体查询的样式,您应该看到如下内容:
在图片示例中,app-23587ee9.css是查询所在的CSS文件的名称,412是行号(此示例来自我的网站,在这种情况下,这实际上是一个已编译的版本化CSS文件这是由Gulp生成的,但大多数主题仍然使用标准CSS。
跟踪css文件,跳到行号,您应该会看到媒体查询的最大宽度在移动屏幕尺寸(可能是320px或480px)时中断。您需要做的是通过搜索和替换扩展该数字以覆盖平板电脑屏幕尺寸。
CSS Tips有一个很好的参考标准设备分辨率,打开平板电脑手风琴项目并选择iPad。您是否想要定位(最多)横向或纵向,如果纵向用768px替换您的移动断点并且横向将其设置为1024px,则取决于您。
要记住的一件事是,现在媒体查询断点可能变得非常复杂,我们现在处理的视网膜屏幕和手机的分辨率比我们以前更高,因此从CSS提示读取该页面更好地了解你想要设置断点的内容。