Html css媒体查询不显示

我有两个样式表像这样连在一起

<link rel="stylesheet" type="text/css" media="screen and (max-width: 800px)" href="{% static '/mobile-style.css" />
<link rel="stylesheet" type="text/css" media="screen and (max-width: 8000px)" href="/style.css">

mobile-style.css

body {color:red}

但是，当我加载页面时，我只会看到style.css页面，而不会看到mobile-style.css页面，即使我将其加载到google Chrome的网站管理员面板中，并将设备切换到小屏幕。我尝试删除缓存等，但运气不佳

我做错什么了吗

<link rel="stylesheet"
 type="text/css"
  media="screen (max-width: 8000px)"
  href="/style.css">

我已经删除了和，只需添加media=“screen（max width:800px）”就可以了。谢谢

---

我已经删除了和，只需添加media=“screen（max width:800px）”就可以了。谢谢

这里总是在

style.css

文件中应用css。因为这里你已经把媒体查询放在下面了

 @media(max-width: 800px){

  }
  @media(max-width: 8000px){

  }

这里的

style.css

文件介质是

（最大宽度：8000px）

。对于

mobile style.css来说总是如此，因为它是媒体
（最大宽度：800px）
。因此，请始终应用
style.css
文件css样式

更新答案…

那么，试试这样吧

<link rel="stylesheet" type="text/css" media="screen and (min-width: 799px)" href="mobile-style.css" >
<link rel="stylesheet" type="text/css" media="screen and (max-width: 800px)" href="style.css">

此处始终在
style.css
文件中应用css。因为这里你已经把媒体查询放在下面了

 @media(max-width: 800px){

  }
  @media(max-width: 8000px){

  }

这里的
style.css
文件介质是
（最大宽度：8000px）
。对于
mobile style.css来说总是如此，因为它是媒体
（最大宽度：800px）
。因此，请始终应用
style.css
文件css样式

更新答案…

那么，试试这样吧

<link rel="stylesheet" type="text/css" media="screen and (min-width: 799px)" href="mobile-style.css" >
<link rel="stylesheet" type="text/css" media="screen and (max-width: 800px)" href="style.css">


为什么用and开头这个句子？那又怎样？你为什么用and开头？还有什么？你添加了
viewport meta
标记了吗？@vivekkupadhyay我从来没有遇到过任何文档说我必须添加它，但我确实添加了
，在没有luckIt的样式表出现之前，可能是因为“查看端口”添加了这个。第二个样式表适用于与第一个相同的情况，因为800px的最大宽度也在8000px的最大宽度范围内。所以你的第一个被立即覆盖。你添加了
viewport meta
标记了吗？@vivekkupadhyay我从来没有遇到过任何文档说我必须添加它，但我确实在样式表之前添加了
，没有luckIt的可能是因为“查看端口”添加此项后，第二个样式表适用于与第一个样式表相同的情况，因为最大宽度800px也在最大宽度8000px的范围内。所以你的第一个被立即覆盖了。谢谢，我为错过那个感到愚蠢谢谢，我为错过那个感到愚蠢