如何修复最小设备宽度和最大设备宽度的CSS错误

Question

使用在线CSS验证程序，我试图验证页面的CSS，但是收到以下2条错误消息：

未知错误org.w3c.css.parser.analyzer.ParseException：不建议使用的媒体功能“最小设备宽度”。有关指导，请参见已弃用 当前“媒体查询”规范中的“媒体功能”部分。

未知错误org.w3c.css.parser.analyzer.ParseException：不建议使用的媒体功能“最大设备宽度”。有关指导，请参见已弃用 当前“媒体查询”规范中的“媒体功能”部分。

    @media only screen
  and (min-device-width : 375px)
  and (max-device-width : 667px) {
        body { font-size: 9.5pt; }
        div.content { width: 96ex; margin: 0; }
    }
@media only screen
  and (min-device-width: 1200px) {
        body { font-size: 10pt; margin: 0 4em; }
        div.content { width: 96ex; margin: 0; }
    }

如何重新编码以上CSS，使其通过验证？

非常感谢您。

Answer 1

无需使用“最小设备宽度”

@media only screen and (min-width: 375px) and (max-width: 667px) {
  body {
    font-size: 9.5pt;
  }
  div.content {
    width: 96ex;
    margin: 0;
  }
}
@media only screen and (min-width: 1200px) {
  body {
    font-size: 10pt;
    margin: 0 4em;
  }
  div.content {
    width: 96ex;
    margin: 0;
  }
}