HTML’de boşluklar ve öğelerin fiziksel olarak ayrılması, yeni başlayan web tasarımcısı için anlaşılması zor olabilir. Bunun nedeni, HTML’nin “boşluk daraltma” olarak bilinen bir özelliğe sahip olmasıdır. HTML kodunuza 1 boşluk veya 100 yazsanız da, web tarayıcısı bu boşlukları otomatik olarak tek bir boşluk olacak şekilde daraltır. Bu, Microsoft Word gibi bir programdan farklıdır ve belge oluşturucuların bu belgenin sözcüklerini ve diğer öğelerini ayırmak için birden çok boşluk eklemesine olanak tanır. Web sitesi tasarım aralığı bu şekilde çalışmaz. Peki, oluşturduğunuz web sayfasında görünen beyaz boşlukları HTML’ye nasıl eklersiniz? Bu makale bazı farklı yolları incelemektedir.
CSS ile HTML’de Boşluklar
HTML’nize boşluk eklemenin tercih edilen yolu Basamaklı Stil Sayfalarıdır (CSS). CSS, bir web sayfasının herhangi bir görsel yönünü eklemek için kullanılmalıdır ve boşluk bir sayfanın görsel tasarım özelliklerinin bir parçası olduğu için CSS, bunun yapılmasını istediğiniz yerdir. CSS’de, öğelerin etrafına boşluk eklemek için kenar boşluğu veya dolgu özelliklerini kullanabilirsiniz. Ayrıca, metin girintisi özelliği, paragrafların girintilenmesi gibi metnin önüne boşluk ekler. Tüm paragraflarınızın önüne boşluk eklemek için CSS’nin nasıl kullanılacağına dair bir örnek. Aşağıdaki CSS’yi harici veya dahili stil sayfanıza ekleyin: p {
metin girintisi: 3em;
}
Metninizin İçinde HTML’de Boşluklar
Metninize yalnızca bir veya iki boşluk daha eklemek istiyorsanız, bölünemez boşluğu kullanabilirsiniz. Bu karakter, standart bir boşluk karakteri gibi davranır, yalnızca tarayıcının içinde çökmez. Bir metin satırına nasıl beş boşluk ekleneceğine dair bir örnek: Bu metnin içinde fazladan beş boşluk var
HTML’yi kullanır: Bu metnin içinde & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; beş ekstra boşluk var
Fazladan satır sonu eklemek için
etiketini de kullanabilirsiniz. Bu cümlenin sonunda beş satır sonu var
HTML’de Boşluk Bırakmak Neden Kötü Bir Fikirdir?
Bu seçeneklerin her ikisi de işe yarasa da – bölünmeyen boşluklar öğesi gerçekten de metninize boşluk ekleyecektir ve satır sonları yukarıda gösterilen paragrafın altına boşluk ekleyecektir – bu, web sayfanızda boşluk oluşturmanın en iyi yolu değildir. Bu öğeleri HTML’nize eklemek, bir sayfanın yapısını (HTML) görsel stillerden (CSS) ayırmak yerine koda görsel bilgiler ekler. En iyi uygulamalar, bunların gelecekte güncelleme kolaylığı ve genel dosya boyutu ve sayfa performansı gibi çeşitli nedenlerle ayrı olması gerektiğini belirtir. Tüm stillerinizi ve aralıklarınızı dikte etmek için harici bir stil sayfası kullanıyorsanız, o stil sayfasını güncellemeniz gerektiğinden, sitenin tamamı için bu stilleri değiştirmek kolaydır. Sonunda beş
etiketi olan cümlenin üstündeki örneği ele alalım. Her paragrafın altında bu kadar boşluk olmasını istiyorsanız, bu HTML kodunu sitenizin tamamındaki her paragrafa eklemeniz gerekir. Bu, sayfalarınızı şişirecek makul miktarda ekstra işaretlemedir. Ek olarak, bu boşluğun çok fazla veya çok az olduğuna karar verirseniz ve biraz değiştirmek isterseniz, web sitenizin tamamındaki her bir paragrafı düzenlemeniz gerekir. Hayır teşekkürler! Bu boşluk öğelerini kodunuza eklemek yerine CSS kullanın. p {
alt dolgu: 20px;
}
Bu bir CSS satırı, sayfanızın paragraflarının altına boşluk ekler. İleride bu aralığı değiştirmek isterseniz, bu tek satırı (tüm sitenizin kodu yerine) düzenleyin ve gitmeniz iyi olur! Şimdi, web sitenizin bir bölümüne tek bir boşluk eklemeniz gerekiyorsa, bir
etiketi veya tek bir bölünemez boşluk kullanmak dünyanın sonu değildir, ancak dikkatli olmanız gerekir. Bu satır içi HTML aralığı seçeneklerini kullanmak kaygan bir eğim olabilir. Bir veya iki tanesi sitenize zarar vermeyebilir, ancak bu yolda devam ederseniz, sayfalarınıza problemler getireceksiniz. Sonunda, HTML aralığı ve diğer tüm web sayfası görsel ihtiyaçları için CSS’ye dönmeniz daha iyi olur.
Biçim mla apa chicago Alıntıınız
Kyrnin, Jennifer. “HTML Beyaz Alanı Oluşturun.” ThoughtCo, Mayıs. 14, 2021, thinkco.com/spaces-in-html-3466574.
Kyrnin, Jennifer. (2021, 14 Mayıs). HTML Whitespace oluşturun. Https://www.thoughtco.com/spaces-in-html-3466574 adresinden erişildi
Kyrnin, Jennifer. “HTML Beyaz Alanı Oluşturun.” ThoughtCo. https://www.thoughtco.com/spaces-in-html-3466574 (24 Mayıs 2021’de erişildi).
