跳转到内容

useGenericFontNames

此内容尚不支持你的语言。

Diagnostic Category: lint/a11y/useGenericFontNames

Since: v1.8.0

Sources:

Disallow a missing generic family keyword within font families.

The generic font family can be:

  • placed anywhere in the font family list
  • omitted if a keyword related to property inheritance or a system font is used

This rule checks the font and font-family properties. The following special situations are ignored:

  • Property with a keyword value such as inherit, initial.
  • The last value being a CSS variable.
  • font-family property in an @font-face rule.
a { font-family: Arial; }
code-block.css:1:18 lint/a11y/useGenericFontNames ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

Generic font family missing.

> 1 │ a { font-family: Arial; }
^^^^^
2 │

Consider adding a generic font family as a fallback.

For examples and more information, see the MDN Web Docs

- serif
- sans-serif
- monospace
- etc.

a { font: normal 14px/32px -apple-system, BlinkMacSystemFont; }
code-block.css:1:43 lint/a11y/useGenericFontNames ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

Generic font family missing.

> 1 │ a { font: normal 14px/32px -apple-system, BlinkMacSystemFont; }
^^^^^^^^^^^^^^^^^^
2 │

Consider adding a generic font family as a fallback.

For examples and more information, see the MDN Web Docs

- serif
- sans-serif
- monospace
- etc.

a { font-family: "Lucida Grande", "Arial", sans-serif; }
a { font-family: inherit; }
a { font-family: sans-serif; }
a { font-family: var(--font); }
@font-face { font-family: Gentium; }