The letter-spacing property in CSS is used to set the spacing behavior between text characters i.e increasing or decreasing the space between characters in a text.
Syntax:
letter-spacing: normal|length|initial|inherit;
Property values:
- normal: The normal letter spacing for the current font i.e no extra space between characters. This is the default value.
- length: This mode specifies extra inter-character space in addition to the default space between characters. Negative values are also allowed.
- initial: This mode sets this property to its default value.
Example: In this example, we are using the above-explained property.
html
<!DOCTYPE html><html>
<head>
<title>CSS letter-spacing Property</title>
<style>
p {
letter-spacing: normal;
}
</style>
</head>
<body style="text-align: center;">
<h1 style="color:green;">
GeeksforGeeks
</h1>
<h2>
CSS letter-spacing Property
</h2>
<p>
This paragraph has letter-spacing: normal;
</p>
</body>
</html>
|
Output:
Example: In this example, we are using letter-spacing: length; property.
html
<!DOCTYPE html><html>
<head>
<title>CSS letter-spacing Property</title>
<style>
p {
letter-spacing: 5px;
}
</style>
</head>
<body style="text-align: center;">
<h1 style="color:green;">
GeeksforGeeks
</h1>
<h2>
CSS letter-spacing Property
</h2>
<p>
This paragraph has letter-spacing: 5px;
</p>
</body>
</html>
|
Output:
Supported Browsers: The browser supported by letter-spacing property are listed below:
- Google Chrome 1.0 and above
- Edge 12.0 and above
- Firefox 1.0 and above
- Opera 3.5 and above
- Apple Safari 1.0 and above