CSS "white-space" özelliği, HTML ve XML belgelerinde boşlukların nasıl işleneceğini belirler. Özellik olarak "normal", "nowrap", "pre", "pre-line" ve "pre-wrap" değerleri kullanılabilir.

• "normal" değeri, belgede bulunan boşlukları ve satır sonlarını birleştirir ve satırları otomatik olarak yeniden boyutlandırır. Bu, varsayılan değerdir ve genellikle metin bloğunda kullanılır.
• "nowrap" değeri, satırlar arasında boşluk bırakmaz ve metnin aynı satırda görünmesini sağlar. Bu, sütunlar arasında metin göstermek için kullanılabilir.
• "pre" değeri, belgede bulunan boşlukları ve satır sonlarını aynen korur. Bu, kod bloğunda veya biçimlendirilmiş metin göstermek için kullanılabilir.
• "pre-line" değeri, belgede bulunan satır sonlarını korur ancak boşlukları birleştirir. Bu, metin bloğunda veya şiirlerde kullanılabilir.
• "pre-wrap" değeri, belgede bulunan boşlukları ve satır sonlarını aynen korur ve ekstra boşluklar oluştuğunda satırı yeniden boyutlandırır. Bu, metin bloğunda veya şiirlerde kullanılabilir.

Aşağıdaki örnekleri inceleyelim...

<div style="white-space: pre;">
   Bu metin içinde
   boşluklar ve satır sonları
   aynen korunacaktır.
</div>

Bu kod bloğunda "white-space" özelliği "pre" değeri kullanılmıştır. Bu nedenle, belgede bulunan boşluklar ve satır sonları aynen korunacaktır ve metin bloğunda görüntülenir.

2. Örneğimize bakalım..

<div style="white-space: nowrap;">
   Bu metin içinde satırlar arasında boşluk bırakılmayacak ve metin aynı satırda görüntülenir.
</div>

Bu kod bloğunda "white-space" özelliği "nowrap" değeri kullanılmıştır. Bu nedenle, satırlar arasında boşluk bırakılmayacak ve metin aynı satırda görüntülenir.

Bir diğer örnek..

<div style="white-space: pre-line;">
   Bu metin içinde
   satır sonları korunacak,
   ancak boşluklar birleştirilecektir.
</div>

Bu kod bloğunda "white-space" özelliği "pre-line" değeri kullanılmıştır. Bu nedenle, belgede bulunan satır sonları korunacak, ancak boşluklar birleştirilecek ve metin bloğunda görüntülenecektir.

Son olarak..

<div style="white-space: pre-wrap;">
   Bu metin içinde
   boşluklar ve satır sonları
   aynen korunacaktır. Ancak ekstra
   boşluklar oluştuğunda satır yeniden
   boyutlandırılacaktır.
</div>

Bu kod bloğunda "white-space" özelliği "pre-wrap" değeri kullanılmıştır. Bu nedenle, belgede bulunan boşluklar ve satır sonları aynen korunacaktır. Ancak ekstra boşluklar oluştuğunda satır yeniden boyutlandırılacaktır ve metin bloğunda görüntülenecektir.

Her bir örnekte görüldüğü gibi "white-space" özelliği ile metin içinde boşlukların nasıl işleneceği ve görüntüleneceği belirlenir. Varsayılan değer "normal" olmasına rağmen, metin bloğunda, kod bloğunda, sütunlar arasında metin göstermek için vb. için kullanılabilir.