- Konu sahibi
- #1
HTML’de
Normal boşlukla
Aşağıdaki dosyayı
Başarılı sonuçta
Karar verirken boşluğun anlamına bakın:
Karakterin sayısal karşılıkları
, “bölünemez boşluk” (non-breaking space) ekleyen özel karakter referansıdır. Tarayıcı bunu normal boşluk gibi gösterir; ancak olağan satır kaydırmada o noktadan bölünmeyi önler. Özel CSS satır kırma kuralları bu davranışı değiştirebilir. Bu nedenle birlikte kalması gereken ifadelerde, örneğin 10 kg veya Bay Yılmaz yazımında kullanılabilir.Normal boşlukla
arasındaki temel fark, tarayıcının satır sonu oluşturma davranışıdır. HTML metninde art arda yazılan normal boşluklar genellikle tek boşluk gibi görüntülenir ve satır gerektiğinde bu boşluklardan bölünebilir. ise iki parçayı birbirine bağlar.En küçük çalışır örnek
Aşağıdaki dosyayı
ornek.html adıyla kaydedip tarayıcıda açabilirsiniz:
HTML:
<!doctype html>
<html lang="tr">
<head>
<meta charset="utf-8">
<title>NBSP örneği</title>
</head>
<body>
<p>Toplam: 10 kg</p>
<p>Ad: Bay Yılmaz</p>
</body>
</html>
Başarılı sonuçta
10 ile kg, ayrıca Bay ile Yılmaz arasında boşluk görünür. Pencere daraldığında tarayıcı bu iki parçayı ayrı satırlara bölmemeye çalışır. HTML kaynağında &nbsp; yazılırsa ziyaretçi boşluk yerine metnini görür. Bu, kodu öğretmek için doğru olabilir; amaç bölünemez boşluk üretmekse kaynakta bulunmalıdır.Hangi durumda kullanılmalı?
Karar verirken boşluğun anlamına bakın:
| İhtiyaç | Uygun kullanım | Nedeni |
|---|---|---|
| Birlikte kalması gereken ifade | 10 kg | Sayı ve birim arasındaki satır bölünmesini önler. |
| Normal paragraf aralığı | Normal boşluk veya CSS | Metin akışını gereksiz yere kilitlemez. |
| Birden çok boşlukla hizalama | CSS düzeni veya tablo | Görsel yerleşim daha kararlı ve erişilebilirdir. |
kullanarak paragrafı girintilemek, düğmeleri hizalamak veya sayfada büyük boş alan oluşturmak iyi bir yöntem değildir. Bu işler için CSS’te margin, padding, gap ve uygun yerleşim özellikleri kullanılmalıdır. Boşluk yalnızca metnin bir parçasıysa karakter referansı anlamlıdır.Görünümü nasıl kontrol edebilirsiniz?
Örnekteki iki paragrafı normal boşluk kullanılan kopyalarıyla karşılaştırın ve pencereyi daraltın. Yalnız ekrandaki boşluğa bakmak yerine HTML kaynağında hangi referansın yazıldığını da kontrol edin. Bir içerik yönetim sistemi metni kaçırıyorsa editörün görsel ve kaynak görünümü farklı sonuç verebilir. Önce çıktıyı inceleyin; aynı referansı art arda eklemek sorunu teşhis etmez.Sık yapılan hatalar
-
ifadesini metin editöründe yazarken&karakterini değiştirmeyin. Ampersand, HTML karakter referansının başlangıcıdır. - Bir kelimenin başına veya sonuna farkında olmadan
koymayın. Kopyalanan metinlerde bu görünmez fark arama, karşılaştırma veya form doğrulamasını etkileyebilir. - Satırın hiçbir koşulda bölünmemesi gereken daha uzun bir aralık varsa, yalnızca boşluk eklemek yerine ilgili kapsayıcının ve metnin CSS davranışını ayrıca tasarlayın.
yalnızca tek bir boşluk çevresindeki bölünmeyi engeller. - HTML kaynak kodunda normal boşlukları çoğaltarak görsel hizalama beklemeyin; HTML’in boşlukları işleme kuralları nedeniyle beklediğiniz kadar boşluk görünmeyebilir.
Karakterin sayısal karşılıkları
  ve   biçimleridir. Yeni kodda anlamı daha kolay okunduğu için tercih edilebilir; farklı gösterimler aynı bölünemez boşluk karakterini ifade eder.