Question

无法获得以下内容，不会在css3中抛出解析错误

@media (min-width: 1500px) {
  div#headerWrapper,
  div#navSuppWrapper {
    width: 100% !important;
    margin: auto;
  }
}

有什么建议吗？

Answer 1

从来没有成为css的粉丝，但这里是一个基本的媒体查询模板，底部的最后一个查询应该可以解决你的问题。

/* #### Mobile Phones Portrait #### */
@media screen and (max-device-width: 480px) and (orientation: portrait){

}

/* #### Mobile Phones Landscape #### */
@media screen and (max-device-width: 640px) and (orientation: landscape){



}

/* #### Mobile Phones Portrait or Landscape #### */
@media screen and (max-device-width: 640px){
  @media screen and (min-device-width: 768px) and (max-device-width: 1024px){




}
}

/* #### iPhone 4+ Portrait or Landscape #### */
@media screen and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2){
 @media screen and (min-device-width: 768px) and (max-device-width: 1024px){




}
}

/* #### Tablets Portrait or Landscape #### */
@media screen and (min-device-width: 768px) and (max-device-width: 1024px){


}

/* #### Desktops #### */
@media screen and (min-width: 1024px){



}

回答@media screen and这是必需的。

@media screen and (min-width: 1500px) {
  div#headerWrapper,
  div#navSuppWrapper {
    width: 100% !important;
    margin: auto;
  }
}

使用@media解析css3中的错误

1 个答案: