Własności zdefiniowane w poniższych podrozdziałach służą do modyfikowania sposobu prezentowania znaków, odstępów, słów oraz akapitów.

16.1 Wcięcie: własność ‚text-indent’

Własność ta służy do określania głębokości wcięcia pierwszego wiersza tekstu bloku. Mówiąc ściślej, własność ta określa wcięcie pierwszego pola znajdującego się w pierwszym polu liniowym bloku. Pole zostaje wcięte względem lewej (albo prawej w tekście pisanym od prawej) krawędzi pola liniowego. Aplikacje klienckie powinny to wcięcie prezentować jako puste miejsce.

Opis wartości:

<length>

Wcięcie ma wartość stałą.

<percentage>

Wcięcie ma wartość równą procentowi szerokości bloku zawierającego:

wartość własności ‚text-indent’ może być ujemna, chociaż mogą występować pewne ograniczenia implementacyjne. Jeśli wartość własności ‚text-indent’ jest ujemna albo przekracza szerokość bloku, pierwsze pole, opisane powyżej, może wyjść poza ten blok. O tym, czy taki wychodzący tekst będzie widoczny decyduje ustawienie własności ‚overflow’.

p { text-indent: 3em }

Uwaga: Ponieważ własność ‚text-indent’ elementów blokowych jest dziedziczna, ma ona wpływ na potomne elementy śródliniowo-blokowe. Dlatego często dobrze jest zastosować deklarację ‚text-indent: 0‚ na rzecz elementów mających własność ‚display:inline-block‚.

16.2 Wyrównanie: własność ‚text-align’

Własność ta służy do określania sposobu wyrównania treści śródliniowej bloków. Opis wartości:

left, right, center, justify

Wyrównuje odpowiednio tekst do lewej, prawej lub środka albo go justuje, zgodnie z zasadami opisanymi w podrozdziale o formatowaniu śródliniowym.

Blok tekstu jest stosem pól liniowych. Wartości ‚left’, ‚right’ oraz ‚center’ określają sposób rozmieszczenia pól śródliniowych w każdym polu liniowym względem lewej i prawej krawędzi tego pola. Pola nie są wyrównywane względem obszaru widoku. Wartość ‚justify’ powoduje, że pola śródliniowe są wyrównane względem obu stron bloku. (Zobacz również własności ‚letter-spacing’ i ‚word-spacing’.)

Jeśli wartością obliczoną własności ‚text-align’ jest ‚justify’ a własności ‚white-space’ — ‚pre’ lub ‚pre-line’, rzeczywista wartość własności ‚text-align’ zostaje ustawiona na wartość domyślną.

div.important { text-align: center }

Zgodne aplikacje klienckie mogą wartość ‚justify’ interpretować jako ‚left’ lub ‚right’, zależnie od tego czy domyślny kierunek tekstu elementu to od lewej do prawej, czy przeciwny.

16.3 Dekoracje

16.3.1 Podkreślenie, nadkreślenie, przekreślenie oraz miganie:: własność ‚text-decoration’

Własność ta służy do definiowania elementów dodatkowo ozdabiających tekst, o kolorze takim samym, jak kolor tekstu. W elementach śródliniowych własność ta działa na wszystkie pola wygenerowane przez dany element. We wszystkich pozostałych rodzajach elementów dekoracje są przekazywane do anonimowego pola śródliniowego otaczającego wszystkie dzieci śródliniowe należące do układu elementu oraz do wszystkich blokowych potomków należących do układu. Nie jest ona jednak przekazywana dalej na potomków pływających i pozycjonowanych bezwzględnie oraz na potomków typów ‚inline-table’ i ‚inline-block’.

Podkreślenia, nadkreślenia i przekreślenia są stosowane wyłącznie na rzecz tekstu (włącznie z białymi znakami, światłem międzyliterowym oraz światłem międzywyrazowym): marginesy, obramowanie oraz dopełnienie nie są dekorowane. Jeśli element nie zawiera tekstu, aplikacje klienckie muszą zaniechać prezentowania tych dekoracji. Na przykład obraz nie zostanie podkreślony.

Własność ‚text-decoration’ elementów potomnych nie ma wpływu na dekoracje elementów nadrzędnych. Przy określaniu umiejscowienia i grubości linii dekoracyjnych tekstu aplikacje klienckie mogą brać pod uwagę rozmiar i przeważające linie bazowe pisma potomków, ale muszą użyć tej samej linii bazowej i grubość w każdej linii. Jeśli element potomny jest pozycjonowany względnie, wszystkie jego dekoracje zostają przesunięte wraz z jego tekstem. Nie ma to wpływu na obliczanie początkowego położenia dekoracji w tej linii.

Opis wartości:

none

Brak dekoracji.

underline

Każda linia tekstu zostanie podkreślona.

overline

Nad każdą linią tekstu zostanie narysowana linia.

line-through

Przez każdą linię tekstu będzie przechodzić linia przekreślenia.

blink

Tekst będzie migał (raz jest widoczny, raz niewidoczny). Zgodne aplikacje klienckie mogą nie respektować tej wartości. Należy zauważyć, że niestosowanie migającego tekstu jest jednym z warunków opisanych w punkcie 3.3 WAI-UAAG.

Kolor dekoracji jest pobierany z własności ‚color’ elementu, na rzecz którego została zastosowana własność ‚text-decoration’. Kolor dekoracji musi pozostać taki sam, nawet jeśli elementy potomne mają inne ustawienia własności ‚color’.

W niektórych aplikacjach klienckich dekoracje tekstu zostały zaimplementowane w taki sposób, że są przekazywane elementom potomnym, zamiast zachowywać stałą grubość i położenie linii, jak opisano powyżej. Prawdopodobnie dopuściły do tego zbyt nieprecyzyjne sformułowania w CSS 2. Aplikacje klienckie SVG 1, tylko CSS 1 oraz tylko CSS 2 mogą implementować ten stary model i być określane jako zgodne z tą częścią CSS 2.1. (Nie dotyczy to aplikacji klienckich utworzonych po opublikowaniu tej specyfikacji.)

a:visited,a:link { text-decoration: underline }

   blockquote { text-decoration: underline; color: blue; }
   em { display: block; }
   cite { color: fuchsia; }

   <blockquote>
    <p>
     <span>
      Help, help!
      <em> I am under a hat! </em>
      <cite> —GwieF </cite>
     </span>
    </p>
   </blockquote>

16.4 Odstępy między literami i wyrazami: własności ‚letter-spacing’ i ‚word-spacing’

Własność ta służy do określania odstępów między znakami w tekście. Opis wartości:

normal

Normalne odstępy między znakami danego fontu. Ta wartość pozwala aplikacji klienckiej zmienić odstępy między znakami, aby wyjustować tekst.

<length>

Wartość określająca przestrzeń między znakami dodawaną do domyślnej przestrzeni. Dopuszczalne są wartości ujemne, ale mogą występować ograniczenia implementacyjne w tym zakresie. Ta wartość nie pozwala aplikacjom klienckim zmieniać przestrzeni między literami, aby wyjustować tekst.

Algorytmy ustalające odstępy między znakami zależą od aplikacji klienckiej.

blockquote { letter-spacing: 0.1em }

blockquote { letter-spacing: 0cm }   /* To samo, co '0' */

Jeśli ostateczny odstęp między dwoma znakami jest inny niż domyślny, aplikacje klienckie nie powinny używać ligatur.

Własność ta służy do określania odstępów między wyrazami w tekście. Opis wartości:

normal

Normalna przestrzeń międzywyrazowa, taka jak zdefiniowana w foncie i/lub aplikacji klienckiej.

<length>

Wartość określająca przestrzeń między wyrazami dodawaną do domyślnej przestrzeni. Dopuszczalne są wartości ujemne, ale mogą występować ograniczenia implementacyjne w tym zakresie.

Algorytmy ustalające odstępy między wyrazami zależą od aplikacji klienckiej. Na odstępy między wyrazami ma wpływ także justowanie (zobacz własność ‚text-align’). Własność ‚word-spacing’ ma wpływ na wszystkie spacje (U+0020), twarde spacje (U+00A0) oraz spacje ideograficzne (U+3000) pozostałe w tekście po zastosowaniu reguł przetwarzania białych znaków.

h1 { word-spacing: 1em }

16.5 Zamiana na wielkie litery: własność ‚text-transform’

Ta własność służy do kontrolowania wielkości liter tekstu elementów. Opis wartości:

capitalize

Zamienia pierwszą literę każdego wyrazu na wielką. Reszta znaków pozostaje bez zmian.

uppercase

Zamienia wszystkie znaki na wielkie.

lowercase

Zamienia wszystkie znaki na małe.

none

Wyłącza własność ‚text-transform’.

Ostateczny efekt każdej konwersji zależy od języka. Aby dowiedzieć się jak sprawdzić język elementu, zobacz dokument RFC 3066 ([RFC3066]).

Własność ta działa tylko na znaki należące do pism, w których wyróżnione są małe i wielkie znaki [UNICODE].

h1 { text-transform: uppercase }

16.6 Białe znaki: własność ‚white-space’

Własność ta służy do określania sposobu traktowania białych znaków w elementach. Opis wartości:

normal

Aplikacje klienckie scalają białe znaki i łamią wiersze w odpowiednich miejscach, aby zapełnić pola blokowe.

pre

Ta wartość zabrania aplikacjom klienckim scalania sekwencji białych znaków. Linie będą łamane w miejscach przejść do nowego wiersza lub na znakach "A’" w treści generowanej.

nowrap

Ta wartość pozwala na scalanie białych znaków, jak wartość ‚normal’, ale wyłącza łamanie wierszy w tekście.

pre-wrap

Ta wartość zabrania aplikacjom klienckim scalania sekwencji białych znaków. Linie są łamane w miejscach przejść do nowego wiersza, na znakach "A" w treści generowanej oraz tam, gdzie potrzeba, aby wypełnić pola liniowe.

pre-line

Ta wartość nakazuje aplikacjom klienckim scalania sekwencji białych znaków. Linie są łamane w miejscach przejść do nowego wiersza, na znakach "A" w treści generowanej oraz tam, gdzie potrzeba, aby wypełnić pola liniowe.

Przejścia do nowego wiersza mogą być w źródle reprezentowane przez znak powrotu karetki (U+000D), znak nowego wiersza (U+000A) lub jeden i drugi (U+000D U+000A) albo w jakiś inny sposób oznaczania początku i końca segmentu dokumentu, np. w języku SGML służą do tego tokeny RECORD-START i RECORD-END. W modelu przetwarzania własności ‚white-space’ przyjęto, że wszystkie przejścia do nowego wiersza zostały znormalizowane do postaci znaku nowego wiersza.

pre        { white-space: pre }
p          { white-space: normal }
td[nowrap] { white-space: nowrap }

pre[wrap]  { white-space: pre-wrap }

16.6.1 Model przetwarzania własności ‚white-space’

Każdy tekst, który znajduje się bezpośrednio w elemencie blokowym (nie wewnątrz elementu śródliniowego) powinien być traktowany jako anonimowy element śródliniowy.

Dla każdego elementu śródliniowego (wliczając anonimowe elementy śródliniowe) wykonywane są następujące czynności (znaki formatowania dwukierunkowego są traktowane tak, jakby ich nie było):

1. Wszystkie tabulatory (U+0009), znaki powrotu karetki (U+000D) oraz spacje (U+0020) znajdujące się w sąsiedztwie znaku nowego wiersza (U+000A) są usuwane, jeśli własność ‚white-space’ ma wartość ‚normal’, ‚nowrap’ lub ‚pre-line’.
2. Jeśli własność ‚white-space’ ma wartość ‚pre’ lub ‚pre-wrap’, wszelkie sekwencje spacji (U+0020) nieprzerwane przez granicę elementu są traktowane jako sekwencje spacji twardych. Jednakże w przypadku wartości ‚pre-wrap’ istnieje możliwość złamania wiersza na końcu sekwencji.
3. Jeśli własność ‚white-space’ ma wartość ‚normal’ lub ‚nowrap’, znaki nowego wiersza zostają dla celów prezentacyjnych zamienione na jeden z następujących znaków: spację, spację o zerowej szerokości (U+200B) lub nie są prezentowane, zależnie od aplikacji klienckiej
4. Jeśli własność ‚white-space’ ma wartość ‚normal’, ‚nowrap’ lub ‚pre-line’,
   1. każdy tabulator (U+0009) zostaje zamieniony na spację (U+0020)
   2. wszystkie spacje (U+0020) znajdujące się za inną spacją (U+0020) — nawet znajdującą się przed linią, jeśli spacja ta również ma własność ‚white-space’ ustawioną na ‚normal’, ‚nowrap’ lub ‚pre-line’ — zostają usunięte.

Następnie cały blok zostaje zaprezentowany. Zostają rozmieszczone elementy śródliniowe, z uwzględnieniem dwukierunkowości, i linie zostają połamane zgodnie z ustawieniami własności ‚white-space’. Miejsca złamań wiersza są określane na podstawie tekstu sprzed wykonania czynności związanych ze scalaniem białych znaków opisanych powyżej.

Przy układaniu każdej linii:

1. Jeśli spacja (U+0020) znajdująca się na początku linii ma własność ‚white-space’ ustawioną na ‚normal’, ‚nowrap’ lub ‚pre-line’ — zostanie usunięta.
2. Wszystkie tabulatory (U+0009) są prezentowane jako poziome przesunięcia wyrównujące krawędź następnego glifu z następnym znakiem tabulacji. Znaki tabulacji mają szerokość 8 spacji (U+0020) renderowanych fontem bloku od początku krawędzi treści bloku.
3. Jeśli spacja (U+0020) znajdująca się na końcu linii ma własność ‚white-space’ ustawioną na ‚normal’, ‚nowrap’ lub ‚pre-line’ — zostanie usunięta.
4. Jeśli spacje (U+0020) lub tabulatory (U+0009) znajdujące się na końcu linii mają własność ‚white-space’ ustawioną na ‚pre-wrap’, aplikacje klienckie mogą je scalić wizualnie.

Element pływający nie powinien wprowadzać miejsca do złamania wiersza.

16.6.2 Przykład dwukierunkowości ze scalaniem białych znaków

Dany jest poniższy fragment kodu znacznikowego z zaznaczonymi spacjami (różne kolory tła i obramowania zostały zastosowane w celu ułatwienia identyfikacji):

     <ltr>A <rtl> B </rtl> C</ltr>

Element <ltr> reprezentuje tekst pisany od lewej, a <rtl> — tekst pisany od prawej. Własność ‚white-space’ jest ustawiona na ‚normal’. Efekt opisanego powyżej modelu przetwarzania byłby następujący:

• Spacja znajdująca się przed B ( ) zostałaby scalona ze spacją znajdującą się za A ( ).
• Spacja znajdująca się przed C ( ) zostałaby scalona ze spacją znajdującą się za B ( ).

W ten sposób w dokumencie zostałyby dwie spacje. W tekście pisanym od lewej, jedna z nich znajdowałaby się za A, a w tekście pisanym od prawej — za B. Następnie wynik zostałby zaprezentowany zgodnie z algorytmem dwukierunkowości Unicode. Ostateczny rezultat byłby następujący:

     A  BC

Należy zauważyć, że między A i B znajdują się dwie spacje, a między B i C nie ma żadnej. Można tego czasami uniknąć poprzez zastosowanie naturalnej dwukierunkowości znaków zamiast jawnych poziomów wbudowań. Ponadto dobrze jest unikać stosowania spacji bezpośrednio wewnątrz znaczników otwierających i kończących, ponieważ przy scalaniu białych znaków dzieją się z nimi dziwne rzeczy.

16.6.3 Znaki sterujące i znaki składowe

Znaki sterujące inne niż U+0009 (tabulator), U+000A (nowy wiersz), U+0020 (spacja) oraz U+202x (znaki formatowania dwukierunkowego) są traktowane w taki sam sposób, jak normalne znaki.

Znaki składowe powinny być traktowane jako część znaku, z którym powinny występować. Na przykład pseudoelement :first-letter zastosuje styl dla całego glifu w treści typu "o<span>̈</span>". Nie zostanie dopasowana tylko podstawowa litera.