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

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 
}

我是不是做错了什么？

它们是否应该在同一个 class 中，或者只要我 link class 到 html 文档就没有关系吗？

Answer 1

您忘记在电话号码后加上 px。

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

Answer 2

你好像忘记了“px”。

一般来说，您可能希望定义一个范围，例如：

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

}

照原样，您在 1366px 媒体查询中的任何 css 都应该显示在 0px 和 1366px 之间。