CSS - font-language-override Property

Quiz

CSS font-language-override property is used to override the typeface behaviour for a particular language. This property is useful for adjusting the rendering of glyphs and features to match the linguistic needs of different languages.

Syntax

font-language-override: normal | language-tag | initial | inherit;

Property Values

Value	Description
normal	It specifies the browser to use the glyphs for the language specified by the lang attribute. Default.
language-tag	It specifies the browser to use the glyphs for the language specified by the language-string. (e.g. "KOR" for Korean, "ENG" for English, "DAN" for Danish, etc.)
initial	It sets the property to its initial value.
inherit	It inherits the property from the parent element.

Examples of CSS Font Language Override Property

The following examples explain the font-language-override property with different values.

Font Language Override Property with Normal Value

To make the font render text using its built-in language settings, applying typographic features based on the language specified in the document or the browsers default language such that no specific language override is applied, we use the normal value. This is shown in the following example.

Example

<!DOCTYPE html>
<html>

<head>
    <style>
        .default-language {
            font-family: 'Arial', serif;
            font-language-override: normal;
        }
    </style>
</head>

<body>
    <h2>
        CSS font-language-override property
    </h2>
    <h4>
        font-language-override: normal
    </h4>
    <p class="default-language">
        This text uses the font's default language
        settings. It is styled with standard 
        English features.
    </p>

</body>

</html>

Font Language Override Property with Language Tags

To override the font's default language settings, we specify a language tag (e.g., "tr" for Turkish, "da" for Danish) to apply typographic features that are appropriate for the specified language, ensuring correct rendering of language-specific glyphs and features. This is shown in the following example.

Example

<!DOCTYPE html>
<html>

<head>
    <style>
        .lang {
            font-family: 'Georgia', serif;
        }

        .turkish {
            font-language-override: "TRK";
        }

        .danish {
            font-language-override: "DAN";
        }
    </style>
</head>

<body>
    <h2>
        CSS font-language-override property
    </h2>
    <h4>
        font-language-override: "TRK", "DAN"
    </h4>
    <p class="lang turkish">
        This text is rendered with Turkish 
        language features. The font adjustments
        for Turkish are applied here.
    </p>

    <p class="lang danish">
        This text is styled with Danish 
        language features. The font adjusts
        to properly display Danish characters.
    </p>
</body>

</html>

Supported Browsers

Property
font-language-override	Not supported	Not supported	34	Not supported	Not supported

css_reference.htm

Print Page