The "text-indent" property is used to specify the indentation of the first line of text within an element.
It allows us to control the space between the left (or right, for right-to-left languages) edge of the element and the start of the text.
selector {
text-indent: length | percentage | initial | inherit;
}
initial: Sets the property to its default value.
inherit: Inherits the property from its parent element.
length: Specifies the indentation using a fixed length value (e.g., pixels, em, etc.).
percentage: Specifies the indentation as a percentage of the width of the containing block.
span {
text-indent: 18px; /* Indentation of 18 pixels */
}
p {
text-indent: 3em; /* Indentation of 3 times the size of the current font */
}
Negative values are also allowed, which causes the first line of text to be outdented.
The text-indent property only affects the first line of the element. Subsequent lines of text are not affected.
This property is commonly used in paragraphs, blockquotes, and other text-containing elements to create a visual hierarchy and improve readability by providing visual separation between paragraphs or sections of text.