CSS - font-stretch Property
The font-stretch property makes text characters wider or narrower than the font's default character width.
Note: If the font face you are using does not support condensed or expanded forms, the font-stretch property will have no effect.
Possible Values
normal: Specifies a normal font face.
semi-condensed, condensed, extra-condensed, ultra-condensed: Specifies a condensed font face than normal.
semi-expanded, expanded, extra-expanded, ultra-expanded: Specifies an expanded font face than normal.
<percentage>: A percentage value, which can be 50% to 200%.
initial: Sets the value to initial value.
inherit: Inherits the value from the parent value.
Applies to
All the HTML elements.
DOM Syntax
object.style.fontStretch = "expanded";
CSS font-stretch - Basic Example
Here is an example:
<html> <head> <style> body { font-family: Arial, sans-serif; } </style> </head> <body> <h2>Font-stretch</h2> <p style = "font-stretch: normal;"> Normal </p> <p style = "font-stretch: condensed;"> Condensed </p> <p style = "font-stretch: expanded;"> Expanded </p> <p style = "font-stretch: 170%;"> 170% stretched </p> </body> </html>
Advertisements
To Continue Learning Please Login
Login with Google