@Media屏幕CSS规则不使用智能手机

Question

我正在尝试仅在智能手机设备上隐藏主页的特定部分。

我正在使用下面的代码，但仍在手机上显示。有建议吗？

@media screen and (max-width: 640px) {
        #statistics .row {
            visibility: hidden;
            display: flex;
            justify-content: center;
        }
        #statistics .row .columns {
            visibility: hidden;
            width: auto;
            margin-top: 3em;
            background: #fff;
            color: #444;
            text-align: center;
            font-size: 85%; 
        }
        #statistics .timer.count-title.count-number {
            visibility: hidden;
            color: #c22362;
            font-size: 35px;
            margin-bottom: 8%
        }
        #statistics .fa {
            visibility: hidden;
            color: #c22362;
        }
   }

Answer 1

从个人经验中，如果您想通过媒体查询隐藏某些内容，则使用visibility: hidden;不是一个好主意。而不是指定这一点，而是说： display: none;

可见性：隐藏；只是隐藏如果在移动设备上查看的内容将在您的网站上留下空白的内容 - 使用显示：无；但是，不显示首选的特定类或ID期间，也没有留下空白。

另外，请确保您清除缓存 - 这也可能就是为什么您没有看到任何更改会生效的原因。