【问题标题】:Second media query not working第二个媒体查询不起作用
【发布时间】:2016-09-16 08:34:25
【问题描述】:

手机的媒体查询不起作用。我查看了其他帖子并没有找到解决方案。

如上所述,问题很简单。笔记本电脑的媒体查询有效,但手机似乎无法识别。 网站: www,beesandthebirds.com

/*Media queries*/

/*Phone*/
@media only screen and (max-width: 415px) {
    #logo{
        background-size: 76%;
        height:60%;
    }
    #text{
        top:49%;
    }
    #text >h1{
        font-size: 4.5em;
    }
    #space{
        bottom: -47px;
    }
    .x8{
        top:625px;
    }
    .x9{
        top:725px;
    }
    .x10{
        top:825px;
    }
}

/*Laptop*/

@media only screen and (min-width:1024px) and (max-width: 1367px) {
    #logo{
        background-size: 21%;
        height:60%;
    }

    #text{
        top:49%;

    }
    #text >h1{
        font-size: 1.5em;
    }
    #space{
        bottom: -47px;
    }


}

【问题讨论】:

  • Notorious_Creed,试试把max-width: 415px改成min-width: 415px
  • 我试过了,也是 0。Als 试图删除其他媒体查询。我最近刚刚添加了 现在它可以工作了。还是谢谢
  • 您可以回答自己的问题并在明天接受。 SO最好有一个回答的问题。

标签: css media-queries media


【解决方案1】:

我最近刚刚添加了“meta name="viewport" content="width=device-width,initial-scale=1.0"" 现在它可以工作了。

【讨论】:

  • 天哪!我一直在寻找解决方案 3 小时!非常感谢
猜你喜欢
  • 2014-02-21
  • 1970-01-01
  • 2015-09-06
相关资源
最近更新 更多