Question

使用Bootstrap前端框架并在网站的某个部分之后，CSS将不会出现在移动设备上，但会在浏览器中查看时显示。我不确定这部分是否以某种方式干扰了网站的其他部分。有问题的div的代码和CSS如下：

HTML：

<div class="project-right">
    <div class="container">
        <div class"row">
            <div class="col-md-8">
                ....
            </div>
            <div class="col-md-4">
                ...
            </div>
        </div>
    </div>
</div>

CSS：

.project-right {
    background-color: black;
    padding: 110px 0px;
}

我已将<meta name="viewport" content="width=device-width, initial-scale=1">添加到我的网站部分。

网站位于：http://bit.ly/1CEdcBj。

Answer 1

尝试将标题链接中的media属性设置为值：

'only screen and (max-device-width: 480px)' ...

应强制css应用于屏幕和最大设备宽度（即您的移动设备）：

    <link rel='stylesheet' media='only screen and (max-device-width: 480px)'
        href='/your/css/file.css' />

我还没试过......

Answer 2

我不确定你在谈论哪个部分，但是你的CSS代码中有一些媒体查询，它们只是在大屏幕上显示元素：

@media only screen and (min-width: 600px)

CSS在移动设备上消失

2 个答案: