How to use the ::first-line pseudo-element in CSS ?
The ::first-line
pseudo-element in CSS is used to style the first line of a block-level element. It allows you to apply styles specifically to the first line of text within an element, making it useful for typographic enhancements or creating decorative effects.
Syntax:
selector::first-line {
/* Styles for the first line */
}
Features:
- Block-Level Elements Only: The
::first-line
pseudo-element only works with block-level elements. It won’t have any effect on inline elements. - Selection Limitations: The
::first-line
pseudo-element allows styling only for the first line of text within a block. You cannot select specific words or characters within that line. - Style Limitations: Some styles may not be applied to
::first-line
. For example, properties likedisplay
,float
, andposition
do not apply to::first-line
.