white-space (proprietà CSS) stabilisce come il web browser deve trattare (ossia, se rispettare o ignorare) gli spazi bianchi tra le parole e le interruzioni di riga del testo. La proprietà in oggetto può assumere i seguenti valori:
– normal: gli eventuali spazi bianchi, supplementari a uno, presenti tra le parole e/o le interruzioni di riga manuale sono ignorati dal web browser; sono invece rispettate le interruzioni di riga automatiche (è il valore di default);
– nowrap: le interruzioni di riga automatiche e gli eventuali spazi bianchi, supplementari a uno, presenti tra le parole sono ignorati dal web browser (quindi il testo continua senza andare mai a capo, salvo sia presente il tag HTML <br>)
– pre: le interruzioni di riga manuale e gli eventuali spazi bianchi, supplementari a uno, presenti tra le parole sono rispettate dal web browser, mentre sono ignorate le interruzioni di riga automatiche: il testo è mostrato dal browser esattamente come accade all’interno del tag HTML <pre>
– pre-line: gli eventuali spazi bianchi, supplementari a uno, presenti tra le parole sono ignorati dal web browser, ma le interruzioni di riga manuale ed automatiche sono rispettate dal web browser
– pre-wrap
Sintassi
[selettore] {
white-space: normal|nowrap|pre|pre-line|pre-wrap;
}
| valore | descrizione |
|---|---|
| XXX | XXX |
Esempi
<style>
.white-space_1 {
white-space: normal;
}
.white-space_2 {
white-space: nowrap;
}
.white-space_3 {
white-space: pre;
}
</style>
<p class="white-space_1">Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 </p>
<p class="white-space_2">Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 </p>
<p class="white-space_3">Test3 Test3 Test3 Test3 Test3
Test3 Test3 Test3 Test3 Test3
Test3 Test3 Test3 Test3 Test3
Test3 Test3 Test3 Test3 Test3 Test3
Test3 Test3 Test3 Test3
Test3 Test3 Test3 Test3 Test3 Test3 Test3 Test3 Test3 Test3</p>
Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1 Test1
Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2 Test2
Test3 Test3 Test3 Test3 Test3
Test3 Test3 Test3 Test3 Test3
Test3 Test3 Test3 Test3 Test3
Test3 Test3 Test3 Test3 Test3 Test3
Test3 Test3 Test3 Test3
Test3 Test3 Test3 Test3 Test3 Test3 Test3 Test3 Test3 Test3
Contenuti correlati
- CSS
- HTML
- JavaScript
- jQuery
- PHP
- SQL
- WORDPRESS
0 Comment