媒体查询无法在Blogspot上运行

Question

我正在尝试在blogspot上实现媒体查询 - http://cricketbeta.blogspot.in/

但他们没有工作，请看一看并告诉我哪里错了

    @media screen and (max-width : 479px) {
/* If screen size less than 479px Load these styles */
/* Done for Smart Phones */
.content{width: 100%!important;}
.sidebar{display: none;}
.container{width:100%;
#topmenu{display: none}
}


@media screen and (min-width: 480px) and (max-width : 768px) {
/* If screen size less than 768px Load these styles */
/* Done for Tablets */
#middle .content{width: 100%!important;}
.sidebar{display: none;}
.container{width:100%;}
.header-bottom{width:100%}
}

@media screen and (min-width: 768px) and (max-width : 1024px) {
/* If screen size less than 960px Load these styles */
/* Done for Tablets */
.content{width: 100%!important;}
.sidebar{width: 100%;}
.container{width:100%;}
.header-bottom{width:100%}
}

Answer 1

我使用的媒体查询如下。看起来你可能会缺少一些说明符。

iPhone：

  

@media only screen and（min-device-width：320px）   和（max-device-width：480px）和（max-device-height：480px）和   （方向：肖像）{

     

}

     

@media only screen and（max-device-width：   480px）和（最小设备宽度：320px）和（最大设备高度：480px）   和（方向：风景）{

     

}

ipad公司：

  

@media only screen and（min-device-width：768px）   和（max-device-width：1024px）和（max-device-height：1024px）和   （方向：肖像）{

     

}

     

@media only screen and（max-device-width：   1024px）和（min-device-width：768px）和（max-device-height：1024px）   和（方向：风景）{

     

}