noUnknownMediaFeatureName

摘要

¥Summary

规则生效日期：v1.8.0

¥Rule available since: v1.8.0
诊断类别：lint/correctness/noUnknownMediaFeatureName

¥Diagnostic Category: lint/correctness/noUnknownMediaFeatureName
此规则为推荐规则，默认启用。

¥This rule is recommended, which means is enabled by default.
此规则没有修复方案。

¥This rule doesn’t have a fix.
此规则的默认严重级别为 error。

¥The default severity of this rule is error.
来源：

¥Sources:
- 与 media-feature-name-no-unknown 相同
  
  ¥Same as media-feature-name-no-unknown

如何配置

¥How to configure

1
{
2
  "linter": {
3
    "rules": {
4
      "correctness": {
5
        "noUnknownMediaFeatureName": "error"
6
      }
7
    }
8
  }
9
}

描述

¥Description

禁止未知的媒体功能名称。

¥Disallow unknown media feature names.

此规则认为 CSS 规范中定义的媒体功能名称（包括编辑草稿）是已知的。此规则还检查供应商前缀的媒体功能名称。

¥This rule considers media feature names defined in the CSS Specifications, up to and including Editor’s Drafts, to be known. This rule also checks vendor-prefixed media feature names.

已知 CSS 媒体功能的数据源是：

¥Data sources of known CSS media feature are:

CSS 媒体功能上的 MDN 参考

¥MDN reference on CSS media feature
媒体查询级别 3 上的 W3C 参考

¥W3C reference on Media Queries Level 3
媒体查询级别 4 上的 W3C 参考

¥W3C reference on Media Queries Level 4
媒体查询级别 5 上的 W3C 参考

¥W3C reference on Media Queries Level 5

示例

¥Examples

无效

¥Invalid

1
@media screen and (unknown > 320px) {}

code-block.css:1:8 lint/correctness/noUnknownMediaFeatureName ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Don’t use unknown media feature names.
  
  > 1 │ @media screen and (unknown > 320px) {}
      │        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    2 │ 
  
  ℹ Unexpected unknown media feature name.
  
  ℹ You should use media feature names defined in the CSS Specifications.

1
@media only screen and (min-width: 320px) and (max-width: 480px) and (unknown: 150dpi) {}

code-block.css:1:8 lint/correctness/noUnknownMediaFeatureName ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Don’t use unknown media feature names.
  
  > 1 │ @media only screen and (min-width: 320px) and (max-width: 480px) and (unknown: 150dpi) {}
      │        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    2 │ 
  
  ℹ Unexpected unknown media feature name.
  
  ℹ You should use media feature names defined in the CSS Specifications.

1
@media (not(unknown < 320px)) and (max-width > 640px) {}

code-block.css:1:8 lint/correctness/noUnknownMediaFeatureName ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Don’t use unknown media feature names.
  
  > 1 │ @media (not(unknown < 320px)) and (max-width > 640px) {}
      │        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    2 │ 
  
  ℹ Unexpected unknown media feature name.
  
  ℹ You should use media feature names defined in the CSS Specifications.

1
@media (400px <= unknown <= 700px) {}

code-block.css:1:8 lint/correctness/noUnknownMediaFeatureName ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Don’t use unknown media feature names.
  
  > 1 │ @media (400px <= unknown <= 700px) {}
      │        ^^^^^^^^^^^^^^^^^^^^^^^^^^^
    2 │ 
  
  ℹ Unexpected unknown media feature name.
  
  ℹ You should use media feature names defined in the CSS Specifications.

有效

¥Valid

1
@media screen and (width > 320px) {}

1
@media only screen and (min-width: 320px) and (max-width: 480px) and (resolution: 150dpi) {}

1
@media (not(min-width < 320px)) and (max-width > 640px) {}

1
@media (400px <= width <= 700px) {}

1
@media screen and (-webkit-width > 320px) {}

noUnknownMediaFeatureName

摘要

如何配置

描述

示例

无效

有效

相关链接