The line-height CSS property is used to control the vertical spacing and height of lines within a block-level element’s content. It specifies the amount of space between lines of text, also known as the leading.

The line-height property accepts various values, including unitless numbers, length values (e.g., pixels or percentages), or the normal keyword.

Here’s an example:

p {
  line-height: 1.5;

In this example, the line-height: 1.5; rule sets the line height of paragraphs to be 1.5 times the font size. This creates additional spacing between lines, making the text more readable and visually appealing.

You can also use specific length values or percentages to set a fixed line height:

h1 {
  line-height: 30px;

In this case, the line-height: 30px; rule sets a fixed line height of 30 pixels for <h1> headings.

The line-height property is commonly used to adjust the vertical spacing between lines of text, helping to improve readability and aesthetics. It can be applied to various elements, including paragraphs, headings, and other block-level elements.

Related posts