我可以限制用户在手机上查看我的响应式网站吗？

Question

我想仅在台式机，笔记本电脑或平板电脑上显示我的响应式网站（使用引导程序）。不在手机上。那么我可以使用HTML，CSS和Bootstrap这样做吗？

Answer 1

使用bootstrap

<div class="visible-xs">
    Sorry, you can't use this site on a mobile.
</div>
<div class="hidden-xs">
    ... my whole site
</div>

但这取决于获取窗口宽度，因此如果桌面用户水平调整其窗口大小，则可能会出现问题。

因此，您可以使用媒体查询和一些标记。 CSS

<style>
    .minus-mobile {
        display: block;
    }
    .mobile {
        display: none;
    }

    @media screen and (max-device-width: 480px) {
        .minus-mobile {
            display: none;
        }
        .mobile {
            display: block;
        }
    }
</style>

和HTML

<div class="mobile">
    Sorry, you can't use this site on a mobile
</div>
<div class="minus-mobile">
    ... my whole site
</div>

我刚刚根据宽度放入，但你也可能想要使用方向条件。