CSS font-variant-east-asian Property


The font-variant-east-asian property controls the usage of alternate glyphs for East Asian scripts. In particular, it is used to control glyph substitution and sizing in East Asian texts.

This property is one of the CSS3 properties.

Initial Valuenormal
Applies toAll elements. It also applies to ::first-letter and ::first-line.
InheritedYes.
AnimatableNo.
VersionCSS3
DOM Syntaxobject.style.fontVariantEastAsian = “ruby”;

Syntax

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

Example of the font-variant-east-asian property:

<!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>

Result

CSS font-variant-east-asian Property

Values

ValueDescription
normalThe 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:
jis78jis83jis90jis04simplifiedtraditional
<east-asian-width-values>Controls the sizing of figures used for East Asian characters. Values are:
proportional-widthfull-width
rubyForces the use of special glyphs for ruby characters.
initialMakes the property use its default value.
inheritInherits the property from its parents element.

Leave a Reply

Your email address will not be published. Required fields are marked *