Open In App

How to Change Line Spacing in CSS?

Last Updated : 23 Nov, 2024
Comments
Improve
Suggest changes
Like Article
Like
Report

The line-height property in CSS is used to adjust line spacing between lines of text.

Syntax

line-height: value;

Example 1: In this example, we will increase the line height using the CSS line-height property.

HTML
<h3>Paragraph with Default Line Spacing</h3>
<p>
    HTML stands for HyperText Markup Language.
    It is the standard language used to create
    and design web pages on the internet. It
    was introduced by Tim Berners-Lee in 1991
    at CERN as a simple markup language.
</p>

<h3>Paragraph with Given Line Spacing</h3>
<p style="line-height: 2;">
    HTML stands for HyperText Markup Language.
    It is the standard language used to create
    and design web pages on the internet. It
    was introduced by Tim Berners-Lee in 1991
    at CERN as a simple markup language.
</p>

Output

line-spacing

Example 2: In this example, we will decrease the line height using CSS line-height property.

HTML
<h3>Paragraph with Default Line Spacing</h3>
<p>
    HTML stands for HyperText Markup Language.
    It is the standard language used to create
    and design web pages on the internet. It
    was introduced by Tim Berners-Lee in 1991
    at CERN as a simple markup language.
</p>

<h3>Paragraph with Given Line Spacing</h3>
<p style="line-height: 75%;">
    HTML stands for HyperText Markup Language.
    It is the standard language used to create
    and design web pages on the internet. It
    was introduced by Tim Berners-Lee in 1991
    at CERN as a simple markup language.
</p>

Output

line-spacing-2


Next Article

Similar Reads