Question

我的CSS查询是

<!-- CSS files for responsive side of site -->
 <link rel="stylesheet" type="text/css" media="screen and (max-width: 1920px) and (min-width: 1900px)" href="../Assets/CSS/Responsive1920.css">
 <!-- 1900 or less -->
 <link rel="stylesheet" type="text/css" media="screen and (max-width: 1900px) and (min-width: 1800px)" href="../Assets/CSS/Responsive1800.css">

这似乎不起作用。他们已经工作了几个月，但现在突然不工作了。我也没有对此做任何更改。文件路径也正确。

Answer 1

您的屏幕尺寸条件看起来很严格，请尝试执行此操作，您将看到1900px尺寸的差异：

<!-- CSS files for responsive side of site -->
 <link rel="stylesheet" type="text/css" media="screen and (min-width: 1900px)" href="../Assets/CSS/Responsive1920.css">
 <!-- 1900 or less -->
 <link rel="stylesheet" type="text/css" media="screen and (max-width: 1900px)" href="../Assets/CSS/Responsive1800.css">

Answer 2

您可以按照以下步骤修改代码：

    <link rel='stylesheet' media='screen and (min-width: 1900px) and (max-width: 1920px)' href='../Assets/CSS/Responsive1920.css' />

    <link rel='stylesheet' media='screen and (min-width: 1800px) and (max-width: 1900px)' href='../Assets/CSS/Responsive1800.css' />

CSS：为什么我的媒体查询不起作用？

2 个答案: