CSS font-size-adjust Property
The font-size-adjust property controls the font size when the first specified font is not available. In such cases, the browser uses the second specified font. Thus, the font size can be changed. The font-size-adjust controls this process.
The font-size-adjust property is one of the CSS3 properties.
All fonts have an "aspect value" which is the difference of size between the lowercase letter and the uppercase letter.
Initial Value | none |
Applies to | All elements. It also applies to ::first-letter and ::first-line. |
Inherited | Yes. |
Animatable | Yes. |
Version | CSS3 |
DOM Syntax | object.style.fontSizeAdjust = "0.5"; |
Syntax¶
font-size-adjust: number | none | initial | inherit;
Example of the font-size-adjust property: ¶
<!DOCTYPE html>
<html>
<head>
<title>The title of the document </title>
<style>
div.a {
font-family: sans-serif;
}
div.b {
font-family: 'times new roman';
}
#box-one,
#box-two {
font-size-adjust: 0.58;
}
</style>
</head>
<body>
<h1>Font-size-adjust property example</h1>
<h2>Two divs with the same font-size-adjust property:</h2>
<div id="box-one" class="a">
The font-size-adjust CSS property sets how the font size should be chosen based on the height of lowercase rather than capital letters.
</div>
<div id="box-two" class="b">
The font-size-adjust CSS property sets how the font size should be chosen based on the height of lowercase rather than capital letters.
</div>
<h2>Two divs without the font-size-adjust property:</h2>
<div class="a">
The font-size-adjust CSS property sets how the font size should be chosen based on the height of lowercase rather than capital letters.
</div>
<div class="b">
The font-size-adjust CSS property sets how the font size should be chosen based on the height of lowercase rather than capital letters.
</div>
</body>
</html>
Values¶
Value | Description |
---|---|
none | No, any font size adjustment. This is the default value of the property. |
number | Sets the aspect value. |
initial | It makes the property use its default value. |
inherit | It inherits the property from its parent's element. |
0 Comments
CAN FEEDBACK
Emoji