响应式网页设计无法正常工作

Question

我正在尝试使我的网站具有响应性，但是当我尝试更改不同尺寸的 css 样式时，其中一些无法正常工作，我不知道为什么。

我已经对我的网站进行了样式设置，然后使用了以下行，当屏幕尺寸达到 1680 时它可以正常工作

@media only screen and (max-width: 1680) {

    css style...

}

但是当我尝试为下一个尺寸做它时，它不会调整大小：

@media only screen and (max-width: 1366) {

     Everything that i put in here doesn't work 
}

我在这里做错了吗？

他们应该在同一个类中，还是只要我将类链接到 html 文档就可以了？

Answer 1

您好像忘记了“px”。

一般来说，你可能想定义一个范围，比如：

@media screen and (min-width: 1366px) and (max-width: 1680px) {

}

按原样，您在 1366px 媒体查询中拥有的任何 CSS 都应显示在 0px 和 1366px 之间。

Answer 2

您忘记在号码后面加上px。

@media only screen and (max-width: 1680px) {
    css style...
}