HTML'de veya bir web sayfasında fazladan boşluk nasıl oluşturulur?

Bir web sayfasında HTML’nizde fazladan boşluk oluşturmak, oluşturmak istediğiniz alanın türüne bağlı olarak birçok yolla elde edilebilir. Aşağıdaki bölümler, hem HTML hem de CSS kullanarak fazladan boşluk oluşturmanın farklı yollarını içerir.

Kendi web sayfasını oluşturan yeni kullanıcılara yönelik en kafa karıştırıcı şeylerden biri, boşluk çubuğuna birden fazla kez basamamaları ve ek boşluklar oluşturmalarıdır. Metninizden önce, sonra veya arasında boşluk bırakmak için (aralıksız boşluk) genişletilmiş HTML karakteri.

Örneğin, "fazladan boşluk" ile HTML kodumuzda aşağıdaki kod vardır.

 Ekstra alan 

Not: Yukarıdaki kodu girmek için bir WYSIWYG editörü kullanıyorsanız, HTML sekmesinde veya HTML kodunu düzenlemeniz gerekir.

  • Genişletilmiş özel HTML karakterlerinin tam listesi.

Bir sayfaya yapıştırılmış metin boşluklarını koru

Fazladan boşluk veya sekme içeren bir metin yapıştırıyorsanız, HTML’yi kullanabilirsiniz.

 metni biçimlendirilmiş halde tutmak için etiketi Aşağıda, metni kullanarak fazladan boşluklarla metin yapıştırmanın bir örneği verilmiştir. 
 etiket.

 Bu metinde çok fazla alan var 

Yukarıdaki örnek aşağıdaki HTML kodunu kullanarak yapılmıştır.

 Bu metinde çok fazla alan var 

Not: Yukarıdaki kodu girmek için bir WYSIWYG editörü kullanıyorsanız, HTML sekmesinde veya HTML kodunu düzenlemeniz gerekir.

  • HTML kodumuza bakın
     Bu etiket hakkında daha fazla bilgi için etiket sayfası.

Bir eleman veya nesnenin etrafında fazladan boşluk yaratmak

Herhangi bir HTML öğesinde üst, sağ, alt veya sola eklenen ek boşluklar olabilir. Ancak, öğe veya başka bir nesnenin çevresine ne tür bir boşluk eklemek istediğinize karar vermeden önce kenar boşluğu ve dolgu arasındaki farkı anlamanız önemlidir. Aşağıdaki resimde gördüğünüz gibi, dolgu maddesi öğenin hemen etrafını çevreleyen, sınır içindeki ve kenarlığın dışındaki kenar boşluğudur.

Aşağıdaki örnekte, paragrafımız bir kenarlıkla çevrilidir, kenar boşluğu ile girintilidir ve paragrafın sağında ve altında boşluk vardır.

Kenar boşluğu ve dolgulu bir paragraf örneği.

Yukarıdaki örnek, aşağıdaki kod kullanılarak oluşturuldu.

Kenar boşluğu ve dolgulu bir paragraf örneği.

Kodun ilk bölümünde, "kenar boşluğu: 2.5em;" girintili metnin görünümünü veren 2, 5 em sol kenar boşluğu ekler. Örnekte gösterildiği gibi, bu boşluk sınırın dışındadır. Bir sonraki bölümde, "dolgu maddesi: 0 7em 2em 0;" üst, sağ, alt ve sol (saat yönünde) dolguyu tanımlamaktadır. "0" üst doldurma, "7em" sağ doldurma, "2em" alt doldurma ve 0 sol doldurma vardır. Bu örneğin geri kalanı, sınırın nasıl görünmesi gerektiğini tanımlıyor.

CSS ve HTML kullanarak bir sekme oluşturma

Bir öğenin sol kenar boşluğunu ayarlayarak HTML'de bir sekme oluşturulabilir. Örneğin, bu paragrafın metni içeren elemanda 2, 5 em bırakma payı vardır. Bu sol marjı oluşturmak için CSS aşağıda gösterilmiştir.

 .tab {kenar boşluğu: 2.5em} 

Bu kodu CSS dosyamıza yerleştirdikten sonra, bir sekmenin görünümünü oluşturmak için "sekme" sınıfını herhangi bir metne uygulayabiliriz. Sol kenar boşluğunun değeri ihtiyaçlarınıza bağlı olarak arttırılabilir veya azaltılabilir.

Yukarıdaki yöntemi tavsiye etmemize rağmen, sol kenardaki CSS ayrıca aşağıdaki örnekte gösterildiği gibi satır içi eklenebilir.

5em sol kenar boşluğu örneği.

5em sol kenar boşluğu örneği.

  • Web sayfamda veya HTML’de metni girintiliğe veya sekmeye nasıl eklerim?

Metnin bir satırının veya paragrafının altına fazladan boşluk eklemeniz gerekirse ve bunu yalnızca bir kez yapmanız gerekiyorsa,

Bir belgeye fazladan boşluk eklemek için etiketi kullanın. Aşağıda bu tekniğin nasıl uygulanabileceğine bir örnek verilmiştir.

Bu cümle örnek metin içeriyor.

Gördüğünüz gibi yukarıdaki boşluğu oluşturmak için iki son eklendi.

Yukarıdaki kod, aşağıda gösterilen metni oluşturur.

Bu cümle örnek metin içeriyor.

Gördüğünüz gibi yukarıdaki boşluğu oluşturmak için iki son eklendi.

Gerekirse ek molalar eklenebilir. Bununla birlikte, bir sayfada birden fazla yerde yapılıyorsa, metninizin çevresine dolgu ve boşluk eklemek için daha önce belirtilen CSS yöntemini kullanmanızı öneririz.