我为我的网站使用了较少的框架。对于移动屏幕分辨率,提供了一个名为“查看完整站点”的按钮。点击时,需要显示站点的桌面版本。简而言之,媒体查询应自动更改为默认值。但我不知道该怎么做。
我知道如果我只制作 2 个单独的版本会很容易 - 一个用于移动设备,一个用于桌面。但我想知道一种使用较少框架获得桌面版本的方法。

最佳答案

解决此问题的一种方法是根据用户选择在 <html><body> 标签上设置或删除类。

例如,默认情况下,您可以拥有

<html class="responsive">

然后,在您的媒体查询中,使用此类为所有内容添加前缀
@media (max-width: 767px) {
    // using LESS syntax here, otherwise, prefix each selector with .responsive
    .responsive {
        // all your CSS for small screens
    }
}

然后,您可以根据点击“查看完整站点”按钮为用户首选项设置 cookie 或某种其他形式的持久值。检测此值并使用它从文档元素中删除 responsive 类,例如(在 <head> 中)
<script>
    if (full_site_requested) {
        document.documentElement.className = document.documentElement.className.replace('responsive', '');
    }
</script>

关于php - 在移动设备中查看桌面站点(使用较少的框架),我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/19533156/

10-12 00:17
查看更多