::first-line (:first-line)

O pseudoelemento ::first-line aplica estilos à primeira linha de um elemento no nível do bloco. Observe que o comprimento da primeira linha depende de muitos fatores, incluindo a largura do elemento, a largura do documento e o tamanho da fonte do texto.

/* Seleciona a primeira linha dentro da tag <p> */
p::first-line {
  color: red;
}

Nota: O CSS3 introduziu a notação ::first-line(com dois pontos) para distinguir pseudo-classes de pseudo-elementos. Os navegadores também aceitam :first-line introduzida no CSS2.

Propriedades permitidas

Somente um pequeno subconjunto de propriedades CSS pode ser usado com o::first-line pseudo-elemento:

Sintaxe

Error: could not find syntax for this item

Exemplos

HTML

<p>Os estilos serão aplicados apenas à primeira linha deste parágrafo.
Depois disso, todo o texto será estilizado normalmente. Entendeu o que eu quis dizer?</p>

<span>A primeira linha deste texto não receberá um estilo especial
porque não é um elemento no nível do bloco.</span>

CSS

::first-line {
  color: blue;
  text-transform: uppercase;


  /* AVISO: NÃO UTILIZE: */
  /* Muitas propriedades são inválidas em pseudo-elementos ::first-line */
  margin-left: 20px;
  text-indent: 20px;
}

Resultado

Especificações

Especificação Status Comentário
CSS Pseudo-Elements Level 4
The definition of '::first-line' in that specification.		 Rascunho atual Define mais estritamente onde ::first-letter pode ocorrer. Generaliza propriedades permitidas para tipografia, decoração de texto e propriedades de layout embutido e opacity. Define a herança de::first-letter.
CSS Text Decoration Module Level 3
The definition of 'text-shadow with ::first-line' in that specification.		 Candidata a Recomendação Permite o uso de text-shadow com ::first-letter.
Selectors Level 3
The definition of '::first-line' in that specification.		 Recomendação Introdução da sintaxe de dois-pontos.
CSS Level 2 (Revision 1)
The definition of '::first-line' in that specification.		 Recomendação Nenhuma mudança.
CSS Level 1
The definition of '::first-line' in that specification.		 Recomendação Definição inicial, usando a sintaxe de dois pontos.

Compatibilidade com navegadores

BCD tables only load in the browser

Veja também