X

Headline

This is an important message requiring you to make a choice if you're based in the EU.

CSS font-variant-east-asian Property

The font-variant-east-asian property controls the usage of alternate glyphs for East Asian scripts.

Initial Value normal
Applies to All elements. It also applies to ::first-letter and ::first-line.
Inherited Yes.
Animatable No.
Version CSS3
DOM Syntax object.style.fontVariantEastAsian = "ruby";

Syntax

font-variant-east-asian: normal | <east-asian-variant-values> | <east-asian-width-values> | ruby | initial | inherit ;

Example

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      h2 {
      font-variant-east-asian: traditional;
      }
    </style>
  </head>
  <body>
    <h2>Font-variant-east-asian property example</h2>
    <h2>大学 → 大學</h2>
  </body>
</html>

Values

Value Description
normal The use of alternate glyphs are not enabled.
<east-asian-variant-values> Specifies a set of logographic glyph variants which are be used for display. Values are:
  • jis78
  • jis83
  • jis90
  • jis04
  • simplified
  • traditional
<east-asian-width-values> Controls the sizing of figures used for East Asian characters. Values are:
  • proportional-width
  • full-width
ruby Forces the use of special glyphs for ruby characters.
initial Makes the property use its default value.
inherit Inherits the property from its parents element.

Browser support

63.0+ x 34.0+ 9.1+ 50.0+


Do you find this helpful?

Related articles