02. ::first-letter - CSS3

Przeznaczenie selektora ::first-letter

::first-letter { ... }

Za pomocą selektora ::first-letter możemy sprawić, że pierwsza litera tekstu znajdującego się w pierwszym wierszu interesującego nas elementu HTML zostanie umieszczona w dodatkowym pseudoelemencie.

Informacje techniczne o selektorze ::first-letter

ograniczenie - elementy HTML

  • Tylko element HTML typu block, typu inline-block, typu table-caption lub typu table-cell.

ograniczenie - właściwości CSS

  • Tylko następujące właściwości CSS: font, text-decoration, text-transform, letter-spacing, word-spacing, line-height, float, vertical-align, margin, padding, border, color, background.

Przykładowa reguła CSS, selektor ::first-letter

Wyjaśnienie przykładowej reguły CSS

p::first-letter

  • spraw, aby pierwsza litera tekstu znajdującego się w pierwszym wierszu każdego elementu p została umieszczona w dodatkowym pseudoelemencie oraz

color

  • była koloru

red

  • czerwonego

Kod źródłowy przykładowego dokumentu HTML

Rezultat

Interpretacja selektora ::first-letter

Last updated