CSS 媒體查詢手機不是全寬

Question

我試圖讓我的網站在手機上全屏顯示，但不知何故不會，除非我縮小手機。 我希望它在開始時全屏顯示，而不是讓我手動進行全屏顯示。 我努力了：

      @media screen and (max-width: 800px) {
  .headHolder .invertText .sk-notouch .template .content-bgr-light .sk-body-admin .sk-em-standard .aa_top_menu_body{
    width: 100%; /* The width is 100%, when the viewport is 800px or smaller */
  }

它不起作用，有人知道嗎？

圖片：

在圖像上，您可以看到右側有更多內容。

Answer 1

將此添加到您的代碼中：

  @media screen and (max-width: 800px) {
    .headHolder .invertText .sk-notouch .template 
    .content-bgr-light .sk-body-admin .sk-em-standard .aa_top_menu_body{
  width: 100%;
  min-width: 100%;
  margin:0;
  box-sizing: border-box;
}

然后，再次將 go 發送到您的chrome-dev並檢查您編寫的 CSS 是否正在應用。 中間有很多類，如果你搞砸了甚至 1 的年表，這可能不會被這樣應用......你在想，你的inspect-element不工作，所以加倍，檢查一下，檢查 - inspect-element window。