Page 1 of 1

CSS Text Spacing

Posted: Fri Oct 27, 2023 8:22 am
by Guest
CSS Text Spacing


Text Spacing
In this chapter you will learn about the following properties:

text-indent
letter-spacing
line-height
word-spacing
white-space


Text Indentation
The text-indent property is used to specify the indentation of the first line of a text:

Example

p {  text-indent: 50px;}
Try it Yourself »


Letter Spacing
The letter-spacing property is used to specify the space between the characters in a text.
The following example demonstrates how to increase or decrease the space between characters:

Example

h1 {  letter-spacing: 5px;}h2 {  letter-spacing: -2px;}
Try it Yourself »


Line Height
The line-height property is used to specify the space between lines:

Example

p.small {  line-height: 0.8;}p.big { 
line-height: 1.8;}
Try it Yourself »








Word Spacing
The word-spacing property is used to specify the space between
the words in a text.
The following example demonstrates how to increase or decrease the space between
words:

Example

p.one {  word-spacing: 10px;}p.two {  word-spacing: -2px;}
Try it Yourself »


White Space
The white-space property specifies how white-space inside an element is handled.
This example demonstrates how to disable text wrapping inside an element:

Example

p {  white-space: nowrap;}
Try it Yourself »


The CSS Text Spacing Properties


Property
Description


letter-spacing
Specifies the space between characters in a text


line-height
Specifies the line height


text-indent
Specifies the indentation of the first line in a text-block


white-space
Specifies how to handle white-space inside an element


word-spacing
Specifies the space between words in a text















+1

Reference: https://www.w3schools.com/css/css_text_spacing.asp