Merhaba Webkolog takipçileri!
Bugün, web sayfalarımıza biraz daha "görsel düzen" katmanın yollarını arayacağız. Yıl 2006 ve web dünyasında tasarımın önemi her geçen gün artıyor. HTML 4.01'in bize sunduğu bazı biçimsel etiketlerle içeriğimizi nasıl daha estetik ve düzenli hale getirebileceğimize bakacağız. Hazır mısınız?
---Sayfalarımızdaki İçeriği Ortalamak: <center>
Bazen bir başlığı, bir paragrafı veya bir görseli sayfanın tam ortasına yerleştirmek isteriz. İşte bu noktada <center> etiketi imdadımıza yetişiyor! İçine aldığınız her şeyi, tarayıcı penceresinin ortasına hizalayacaktır.
Unutmayın, bu etiket daha çok görsel bir düzenleme için. İleride CSS ile çok daha esnek ve güçlü hizalama seçenekleriniz olacak, ama şimdilik <center> işimizi fazlasıyla görecektir.
<center>
<h4>Bu Başlık Ortalanmış!</h4>
<p>Bu paragraf da sayfanın tam ortasında yer alıyor.</p>
</center>Satır Arası Boşluklar ve Yatay Çizgiler: <br> ve <hr>
Metinlerimizi yazarken yeni bir satıra geçmek istediğimizde genellikle Enter tuşuna basarız, ancak HTML bu satır sonlarını otomatik olarak algılamaz. İşte burada satır sonu etiketi <br> devreye giriyor. Bir paragraf içinde yeni bir satıra geçmek için bu etiketi kullanabilirsiniz.
<p>Merhaba dünya!<br />
Bu yeni bir satır.</p>Sayfalarımızda konuları birbirinden ayırmak veya görsel bir bölme oluşturmak için ise yatay çizgi etiketi <hr> (Horizontal Rule) kullanırız. Bu etiket, sayfanıza basit bir yatay çizgi çizer ve okuyucular için bir nevi "konu değişimi" sinyali verir.
<p>Yukarıdaki konu sona erdi.</p>
<hr />
<p>Şimdi yeni bir konuya başlıyoruz.</p>Sayfalarımızı Bölümlere Ayırmak: <div>
Web sayfamızın farklı bölümlerini birbirinden ayırmak, gruplamak ve onlara özel düzenlemeler yapmak istediğimizde <div> etiketi bizim en büyük yardımcımızdır. "Division" kelimesinin kısaltması olan <div>, bir sayfayı mantıksal veya görsel olarak bölümlere ayırmak için kullanılan jenerik bir blok seviyesi etikettir.
Şimdilik <div>'i bir "kutu" veya "katman" gibi düşünebilirsiniz. İçine diğer HTML etiketlerini yerleştirebilir, böylece o kutunun içindeki tüm içeriğe tek seferde işlem uygulayabilirsiniz. İleride CSS ile bu div'lere renkler, kenarlıklar veya farklı boyutlar vererek sayfalarımızı bambaşka bir görünüme kavuşturacağız!
<div>
<h5>Bu bir bölüm başlığıdır.</h5>
<p>Bu bölümdeki içerikler burada yer alıyor.</p>
</div>
<div>
<p>Başka bir bölüm.</p>
</div>Bugün HTML 4.01'deki bu basit ama etkili biçimsel etiketleri öğrendik. Gördüğünüz gibi, web sayfalarımıza biraz daha düzen ve estetik katmak hiç de zor değilmiş. Bu etiketleri kullanarak, içeriklerinizi daha okunabilir ve çekici hale getirebilirsiniz.
Kendi HTML dosyalarınızda bu etiketleri denemekten çekinmeyin. Pratik yapmak, öğrenmenin en hızlı yoludur!
Webkolog'u takipte kalın!
Hepinize bol kodlu ve başarılı projeler dilerim!
0 yorum:
Yorum Gönder