CSS @media 規則在哈巴狗？

Question

是否可以對哈巴狗應用@media 規則？ 當屏幕尺寸改變時，我不知道如何調整我的頁面組件。

我試過了

@media only screen and (max-width : 320px){
    body{
      background: #FF5D50;
    }
}

但是當我在 Chrome 上更改設備時沒有任何反應。

Answer 1

所有 CSS 包括 @media 規則都應該在 Pug 模板中工作，您只需要確保在style.

style.
    @media only screen and (max-width: 320px) {
        body {
            background: #FF5D50;
        }
    }

Answer 2

一旦在 pug 布局中正確設置了標題，媒體查詢就會起作用。

meta(content='width=device-width' initial-scale='1' shrink-to-fit='no' name='viewport')