Giriş yap

HTML'de Temeller

Eğer aşağıdaki etiketlerin kullanım anlarını anlamıyorsanız sorun etmeyin, zaman içerisinde kafanızda yer edinmeye başlayacaktır.



HTML'in Temel Etiketleri

Tüm HTML sayfaları <!DOCTYPE> tanımı ile başlarlar. Bu tanım sayfanın HTML sürümünü temsil eder.

Ve diğer tüm html etiketleri <html> etiketi içerisinde yazılmalıdır.

Son kullanıcının göreceği her şey <body> etiketi içerisinde yazılır.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    içerik..
</body>
</html>

HTML'de Başlıklar

Başlıklar <h1> ile <h6> etiketleri arasında tanımlanır.

<h1> en önemli başlıklar için, <h6> daha az öneme sahip başlıklar için kullanılır.

<h1>Başlık Örneği</h1>
<h2>Başlık Örneği</h2>
<h3>Başlık Örneği</h3>
<h4>Başlık Örneği</h4>
<h5>Başlık Örneği</h5>
<h6>Başlık Örneği</h6>

HTML'de Paragraf

Paragraflar için <p> etiketi kullanılır.

<p>Bu bir paragraf örneğidir.</p>

HTML'de Bağlantılar

HTML'de bir adrese bağlantı verirken <a> etiketi kullanılır. Bu örnekte href bağlantıya tıklandığında gidilecek adresi belirlemek için kullanılır. Nitelikler, HTML etiketleri hakkında daha fazla bilgiyi belirlemek için kullanılır.

<a href="https://prototurk.com">Prototürk'ü ziyaret et</a>

HTML'de Resim

HTML'de resimleri göstermek için <img> etiket kullanılır. Hatırlarsanız, bazı etiketlerin kendi kendine kapandığından bahsetmiştik, bu etiket onlara bir örnektir. Ve nitelikler olmadan, <img> etiketi hiçbir şey göstermez.

<img> etiketinde resim yolunu belirlemek için src="", resim yoksa gözükecek alternatif yazı için alt="", genişlik ve yüksekliği ayarlamak için width="" ve height="", üzerine gelince açıklama çıkartmak için title="" niteliği kullanılır. Hepsini bir araya toplayıp test edecek olursak;

<img src="test.png" alt="Resim yoksa gözükür" title="Bu başlık üzerine gelince gözükür sadece" width="300" height="200">

HTML'de Listeler

HTML'de listeler <ul> ve <ol> etiketleri arasında <li> içerisinde tanımlanır. Örnek vermek gerekirse;

<ul>
    <li>Elma</li>
    <li>Armut</li>
    <li>Erik</li>
</ul>

Daha fazla örneğe ilerleyen bölümlerde birlikte göz atacağız.

tayfunerbilen
540 gün önce yazdı.
Önceki Başlangıç Sonraki Etiketler