媒体查询根本不起作用

debugcn 发表于 Dev

瑞奇

在完成我的整个网站之后，我被介绍给媒体查询，以使我的网站具有响应能力。事实是，即使我在Media查询中找到了很多资源，而且我知道键入什么，它们根本不起作用。

我首先尝试测试媒体查询，以了解其工作原理。这是代码：

<style> 
@media screen and (min-width:600px){

#bigfont
{
    font-size: 80px;
    line-height: 79px;
    font-family: dosis, sans-serif;
    font-weight: 300;
}
}
 </style>

“ bigfont”已经是CSS的样式。因此，在放置媒体查询时，应该绕过原始样式并应用新参数。

由于我的笔记本电脑屏幕的宽度大于600像素，因此我期望它能正常工作，但没有成功。我的目标是使用媒体查询，以便在真正大屏幕上扩大我的内容。

我什至将min更改为max，以防万一没有结果。

更新：
我忘了提到我已经有了这个：

<meta name="viewport" content="width=device-width, initial-scale=1">

约米西米

你尝试过@media all and (min-width:600px){吗？那通常为我解决。

如果那不起作用，请尝试将值设置为!important（覆盖目前为止的所有内容，因此您需要将其保留在!important较大的屏幕上，如所示min-width，在较小的屏幕上使用，如果您具有max-width）。

    #bigfont
{
    font-size: 80px !important;
    line-height: 79px !important;
    font-family: dosis, sans-serif !important;
    font-weight: 300 !important;
}

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。