为什么媒体查询在我的博客上不起作用？
Why isn't media query working on my blog?
这是我的博客：Blog
我在其 CSS:
中编写了以下代码
@media screen and (max-width: 600px){
.title a{
color: red !important;
}
}
@media screen and (max-width: 500px){
header{
display: none !important;
}
}
但是当我在 phone 中打开此博客时，它没有任何反应。无论您是在 phone 还是桌面浏览器中打开，网站都会按原样打开。为什么会这样？
你的 header 里有这个，
<meta content="width=1100" name="viewport">
请将其更改为：
<meta name="viewport" content="width=device-width, initial-scale=1">
要了解元视口的工作原理，请参阅：https://developer.mozilla.org/en/docs/Mozilla/Mobile/Viewport_meta_tag
您的代码中发生的事情是您为网页设置了 "atleast 1100px" 宽度。
通过将其更改为设备宽度，您的网页将与设备一样宽。
这是我的博客：Blog 我在其 CSS:
中编写了以下代码@media screen and (max-width: 600px){
.title a{
color: red !important;
}
}
@media screen and (max-width: 500px){
header{
display: none !important;
}
}
但是当我在 phone 中打开此博客时，它没有任何反应。无论您是在 phone 还是桌面浏览器中打开，网站都会按原样打开。为什么会这样？
你的 header 里有这个，
<meta content="width=1100" name="viewport">
请将其更改为：
<meta name="viewport" content="width=device-width, initial-scale=1">
要了解元视口的工作原理，请参阅：https://developer.mozilla.org/en/docs/Mozilla/Mobile/Viewport_meta_tag
您的代码中发生的事情是您为网页设置了 "atleast 1100px" 宽度。
通过将其更改为设备宽度，您的网页将与设备一样宽。