Curriculum
Course: CSS
Login

Curriculum

CSS

CSS INTRODUCTION

0/1

CSS Selectors

0/1

CSS Comments

0/1

CSS Padding

0/1

CSS Box Model

0/1

CSS Combinators

0/1

CSS Pseudo-classes

0/1

CSS Pseudo-elements

0/1

CSS Dropdowns

0/1

CSS Image Gallery

0/1

CSS Image Sprites

0/1

CSS Counters

0/1

CSS Website Layout

0/1

CSS Specificity

0/1

CSS Math Functions

0/1
Text lesson

Text Spacing

This chapter covers the following properties:

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

Text Indentation

The text-indent property determines the offset of the initial line in a block of text.

Example

{
  text-indent: 50px;
}

Letter Spacing

The letter-spacing property is employed to define the spacing between characters in a text.

The subsequent example illustrates how to adjust the spacing between characters, either increasing or decreasing it.

Example

h1 {
  letter-spacing: 5px;
}

h2 {
  letter-spacing: -2px;
}

Line Height

The line-height property determines the spacing between lines of text.

Example

p.small {
  line-height: 0.8;
}

p.big {
  line-height: 1.8;
}

Word Spacing

The word-spacing property is utilized to define the space between words in a text.

The following example illustrates how to adjust the spacing between words, either increasing or decreasing it.

Example

p.one {
  word-spacing: 10px;
}

p.two {
  word-spacing: -2px;
}

White Space

The white-space property dictates the handling of white space within an element.

This example illustrates how to deactivate text wrapping within an element.

Example

{
  white-space: nowrap;
}

The CSS Text Spacing Properties

Property

Description

letter-spacing

Defines the spacing between characters in text.

line-height

Defines the height of lines in text.

text-indent

Defines the indentation of the first line in a text block.

white-space

Determines how to manage white space within an element.

word-spacing

Sets the spacing between words in text.