CSS

White-space

  • 2007-06-19 15:31
  • 1 komentarz
  • 2426 odsłon
  • Oceń ten tekst jako pierwszy
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 <br/>) (8 spacji)

pre Nowa linia (zastosowany znak nowej lini, brak tagu <br/>) (8 spacji)

nowrap Nowa linia (zastosowany znak nowej lini, brak tagu <br/>) (8 spacji)

pre-wrap Nowa linia (zastosowany znak nowej lini, brak tagu <br/>) (8 spacji)

pre-line Nowa linia (zastosowany znak nowej lini, brak tagu <br/>) (8 spacji)


Pokrewne style


  • brak

Odpowiednik hipertekstowy


Wersja specyfikacji


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;

1 komentarz

DzieX 2007-10-31 20:33

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 */