HTML'de Görüntüleme Değerleri
Her HTML etiketi, varsayılan bir görüntüleme değerine sahiptir. Çoğu etiketin varsayılan görüntüleme değeri ise ya block yani blok seviyeli etiket ya da inline yani satır içi seviyeli etiket görünümündedir. Şimdi gelin sırasıyla bu görüntüleme değerlerini inceleyelim.
Blok Seviyeli Etiketler
Blok seviyeli etiketler, her zaman yeni bir satırdan başlar ve genişliğin tamamını alır yani 100% olarak gözükürler. Bu sayede blok seviyeli etiketleri anlamamız kolaylaşır. Blok seviyeli etiketlere verebileceğimiz en yaygın etiket <div> etiketidir. Peki nedir bu <div> etiketi?
Aslında <div> etiketi HTML sayfada bölümleri temsil eder. Yani her yeni bir div, yeni bir bölüm anlamına gelir. Bölüm bölüm ayırmak istediğimizde genelde <div> etiketini kullanırız. Ancak blok seviyeli etiket ihtiyacımızı genelde bu etiketten karşılarız, şu an pek bir anlam ifade etmeyebilir çünkü kullanıldığında çıktı olarak farklı bir görünüm vermez, amaç burada zaten bir görünüm vermesi değil bu etiketi kullanarak görünümü özelleştirmektir. Bunun içinde tabi CSS gerekiyor, oda ilerleyen derslerde :) Şu an sadece böyle bir etiket olduğunu ve bu etiketin blok seviyeli bir etiket olduğunu ve en çok kullanılan etiketlerden biri olduğunu bilmeniz yeterli.
Basit bir örnek verelim;
<div> Merhaba Dünya </div> Test Ediyoruz.
Tabi <div> etiketi normalde belli başlı niteliklerle kullanılır. Bu nitelikleri bu etiketin kendi sayfasında detaylı olarak bulabilirsiniz. Yukarıdaki örneği çalıştırdığınızda hiçbir görünüm değişikliği olmadığını fark edeceksiniz, ancak 2. yazılan içeriğin alttan başladığını göreceksiniz, buda blok seviyeli etiketi anlamakta faydalı olmuştur diye umuyorum. Önceki derslerde sıkça kullandığımız <p> etiketide yine görüntüleme seviyesi olarak blok seviyeli bir etiketti ve yeni satırdan başlıyordu.
Ayrıca diğer blok seviyeli etiketlerin listesine aşağıdan ulaşabilirsiniz;
<address>
<article>
<aside>
<blockquote>
<canvas>
<dd>
<div>
<dl>
<dt>
<fieldset>
<figcaption>
<figure>
<footer>
<form>
<h1>-<h6>
<header>
<hr>
<li>
<main>
<nav>
<noscript>
<ol>
<p>
<pre>
<section>
<table>
<tfoot>
<ul>
<video>
<div> etiketi stilsiz bir HTML etiketidir. Genellikle diğer HTML etiketlerinin kapsayıcısı olarak kullanılır zira CSS öğrenmeye başladığımızda bunun nedenini daha iyi anlayacaksınız, şimdilik kafanıza takmayın ve sadece etiketin ne olduğunu bilin yeter.
Satır içi Seviyeli Etiketler
Bu etiket türünün en çok kullanılanı da <span> etiketidir. Adı üstünde satır içi bir etiket türüdür yani yazı içerisinde işaretleme yapıldığında bile herhangi bir bozulma, herhangi bir değişiklik olmaz tıpkı <div> etiketinde olduğu gibi, <span> etiketide ağırlıklı olarak satır içi elemanları belirleyip onlara CSS ya da JavaScript uygulamak için kullanılan stilsiz bir etikettir. Bir örnek verecek olursak;
Normal bir yazı sırasında <span>span içerisinde yazılan bu alan</span> diğerlerinden hiçte farklı görünmeyecek.Ayrıca diğer satır içi seviyeli etiketlerin listesine aşağıdan ulaşabilirsiniz;
<a>
<abbr>
<acronym>
<b>
<bdo>
<big>
<br>
<button>
<cite>
<code>
<dfn>
<em>
<i>
<img>
<input>
<kbd>
<label>
<map>
<object>
<output>
<q>
<samp>
<script>
<select>
<small>
<span>
<strong>
<sub>
<sup>
<textarea>
<time>
<tt>
<var>
<div> normalde blok seviyeli bir etikettir ancak bunu CSS yardımı ile satır içi seviyeli bir etiket haline getirebilirim.
