CSS MEDIA QUERY Mobile 不是全宽

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;
}

然后，再次转到您的chrome-dev 并检查您编写的 CSS 是否正在应用。中间有很多类，如果你弄乱了甚至 1 的年表，这可能不会被应用……你在想，你的 CSS 不工作！所以加倍，检查一下，在inspect-element窗口中。