设置大尺寸的媒体查询

Question

我正在尝试了解媒体查询，我想为大于13英寸的屏幕设置css值

这是正确的语法吗？

@media all and (min-width : 992px) {
    .myElement{
        width: 100px;
    }

或

@media all and (@screen-md-min) {
    .myElement{
        width: 200px;
    }

这有什么不同？

Answer 1

这取决于分辨率和质量。对于72 PPI（每英寸像素数）的屏幕（平均分辨率），13英寸等于72 x 13 = 936像素。因此，您将使用的语法是：

@media screen and (min-width: 936px) {
  .myElement {
    width: 200px;
  }
}

编辑：稍微增加min-width以仅对13“以上的屏幕应用样式。但同样，这取决于屏幕的分辨率和质量。