CSS

White-space

Kooba

white-space - ustala w jaki sposób mają być wyświetlane białe znaki (spacje, tabulatory, znaki nowej linii).

Możliwe wartości:

  • normal - (domyślna) kilka sąsiadujących spacji zamienianych jest na jedną, wiersz jest przełamywany gdy w linii kończy się miejsce
  • pre - umożliwia wyświetlenie wielu spacji obok siebie, wiersz jest przełamywany po napotkaniu znaku nowej linii (enter) bez koniecznośći użycia tagu (x)html Br
  • nowrap - tak jak "normal", ale należy użyć tagu (x)html Br aby przełamać linie (jeśli tekst nie zmieści się na ekranie wyświetlony zostanie poziomy suwak)
  • pre-wrap - umożliwia wyświetlenie kilku sąsiadujących spacji, wiersze przełamywane są po napotkaniu znaku nowej linii oraz na końcu strony
  • pre-line - tak jak pre-wrap tylko, że nie pozwala wyświetlać sąsiadujących ze sobą spacji
  • Inherit

Przykład użycia:

p { white-space: normal }
p { white-space: pre }
p { white-space: nowrap }
p { white-space: pre-wrap }
p { white-space: pre-line }

normal Nowa linia (zastosowany znak nowej lini, brak tagu `
`) (8 spacji)

pre Nowa linia (zastosowany znak nowej lini, brak tagu `
`) (8 spacji)

nowrap Nowa linia (zastosowany znak nowej lini, brak tagu `
`) (8 spacji)

pre-wrap Nowa linia (zastosowany znak nowej lini, brak tagu `
`) (8 spacji)

pre-line Nowa linia (zastosowany znak nowej lini, brak tagu `
`) (8 spacji)

Pokrewne style

  • brak

    Odpowiednik hipertekstowy

  • tag Pre

    Wersja specyfikacji

  • CSS 1 (normal, pre, nowrap)
  • CSS 2 (inherit)
  • CSS 2.1 (pre-wrap, pre-line)

    Wsparcie przeglądarek

  • IE5 nie obsługuje polecenia;
  • IE6 oraz IE7 obsługują "nowrap", a "pre" w trybie zgodności;
  • Firefox 2 obsługuje "nowrap" i "pre";
  • Opera 9 obsługuje "nowrap", "pre" i "pre-wrap";
  • Safari w pełni obsługuje polecenie;
CSS

1 komentarz

A żeby nie było tylko w specyfikacji:

white-space: pre; /* CSS2 */
white-space: -moz-pre-wrap; /* Mozilla */
white-space: -hp-pre-wrap; /* HP printers */
white-space: -o-pre-wrap; /* Opera 7 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: pre-wrap; /* CSS 2.1 */
white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
word-wrap: break-word; /* IE */