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;

可见性：隐藏;如果在移动设备上查看，只需隐藏将在您的网站上留下空白的内容 - 使用display：none;但是，不显示首选的特定类或id期间，并且不留任何间隙。

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

@media屏幕CSS规则无法在智能手机上运行

1 个答案: