HTML BLOK VE SATIR ETİKETLERI

HTML’de kullanılan etiketler blok ve satır olarak iki gruba ayrılır. Blok etiketleri, sayfada belirli bir bölgeyi kaplayan ve yeni bir satıra geçen etiketlerdir. Satır etiketleri ise, bir satırın içinde yer alabilen ve genellikle küçük özellikler ekleyen etiketlerdir.

HTML’de kullanılan blok etiketlerinin örneği <div> etiketidir. Bu etiket sayfada belirli bir bölgeyi kaplar ve altında yer alan tüm elementleri de kapsar. Diğer blok etiketler arasında <h1>-<h6> başlık etiketleri, <p> paragraf etiketi, <ul> sırasız liste etiketi, <ol> sıralı liste etiketi ve <table> tablo etiketi bulunur.

Blok etiketleri, sayfada düzenlemeler yaparken büyük bir esneklik sağlarlar. Örneğin, <div> etiketi ile bir web sayfasının üst kısmını kapsayacak bir bölge oluşturabilirsiniz ve bu bölgede farklı etiketler kullanarak başlık, alt başlık, resim gibi farklı özellikleri ekleyebilirsiniz.

Satır etiketleri ise, bir satırın içinde yer alabilen ve genellikle küçük özellikler ekleyen etiketlerdir. Bunların en yaygın örnekleri <a> bağlantı etiketi, <img> resim etiketi, <br> satır sonu etiketi ve <hr> yatay çizgi etiketidir. Satır etiketleri, blok etiketlerden daha sınırlı bir kullanım alanına sahiptir ancak sayfanın görünümünü detaylandırmak için önemlidirler.

Sonuç olarak, HTML’de kullanılan blok ve satır etiketleri web sayfalarının düzenlenmesinde büyük bir rol oynarlar. Blok etiketler sayfada belirli bir bölgeyi kaplayarak altındaki tüm elementleri kapsarlarken, satır etiketleri bir satırın içinde yer alabilen ve küçük özellikler ekleyen etiketlerdir. Her iki etiket de web sayfasının yapısını belirlemek için kullanılır ve HTML dilinin temel bileşenlerini oluştururlar.

1. <div> etiketi: Bu etiket, sayfada belirli bir bölgeyi kaplar ve altındaki her şeyi kapsar. Örneğin:

<div>
  <h1>Merhaba Dünya!</h1>
  <p>Bu bir paragraf.</p>
</div>

Bu kodda, <div> etiketi arasında başlık ve paragraf etiketleri yer alıyor. Div etiketi, bu iki etiketi kapsıyor ve sayfa içinde belirli bir bölge oluşturuyor.

2. <h1>-<h6> başlık etiketleri: Bu etiketler, sayfada farklı boyutlarda başlıklar eklemek için kullanılır. Örneğin:

<h1>Başlık 1</h1>
<h2>Başlık 2</h2>
<h3>Başlık 3</h3>

Bu kodda, <h1>-<h3> etiketleri farklı boyutlarda üç farklı başlık ekler.

3. <table> tablo etiketi: Bu etiket, sayfada tablolar oluşturmak için kullanılır. Örneğin:

<table>
  <tr>
    <th>Ad</th>
    <th>Soyad</th>
  </tr>
  <tr>
    <td>Ahmet</td>
    <td>Yılmaz</td>
  </tr>
  <tr>
    <td>Mehmet</td>
    <td>Özdemir</td>
  </tr>
</table>

Bu kodda, bir tablo oluşturmak için <table>, <tr>, <th> ve <td> etiketleri kullanılır.

Şimdi de satır etiketlerine birkaç örnek vereyim:

1. <a> bağlantı etiketi: Bu etiket, sayfada başka bir sayfaya ya da belirli bir konuma bağlantı eklemek için kullanılır. Örneğin:

<a href="https://www.google.com">Google'a git</a>

Bu kodda, <a> etiketi bir bağlantı oluşturur ve href özelliği ile bu bağlantının hedefini belirler.

2. <img> resim etiketi: Bu etiket, sayfada bir resim eklemek için kullanılır. Örneğin:

<img src="resim.jpg" alt="Bir resim">

Bu kodda, <img> etiketi bir resim ekler ve src özelliği ile resmin dosya yolunu belirtir.

3. <br> satır sonu etiketi: Bu etiket, sayfada yeni bir satıra geçmek için kullanılır. Örneğin:

<p>Bu bir paragrafın ilk satırı.<br>Paragrafın ikinci satırı.</p>

Bu kodda, <br> etiketi paragrafın ilk satırından sonra bir satır boşluğu bırakır ve paragrafın ikinci satırını yeni bir satırda başlatır.