Anasayfa / Web Tasarım / HTML / HTML Sık Kullanılan Etiketler (Ders 3)

HTML Sık Kullanılan Etiketler (Ders 3)

Html’de etiketler blok ve satır içi olmak üzere ikiye ayrılır. Blok etiketleri bir satırın tamamını kaplarken, satır içi etiketler bir satırda birden fazla kullanabilirsiniz. Örneğin şuan okuduğunuz paragraf bir blok, altı çizili olan kısımlar satır içidir. Şimdide sıklıkla kullanacağımız etiketlerin bazılarını tanıyalım.

NOT: Html sayfalarının içerisinde türkçe karakter kullanabilmek için <head> etiketi arasına şu kodu yazmalısınız.

<meta charset="UTF-8">

Bu kod sayfamızda türkçe karakter serisi (UTF-8) kullanılmasını sağlar.

<p>…</p>

Paragraf etiketidir. <p> etiketi bir blok etikettir. Yazmak istediğimiz paragrafları bu etiketin arasına yazarak yayınlayabiliriz.

<hx>…</hx>

Başlık etiketidir. “x” yerine 1’den 6’ya kadar bir sayı yazılarak kullanılır. H etiketlerinin en büyüğü h1 , en küçüğü ise h6 ‘dır. <hx> etiketi bir satır içi etikettir.

<font>…</font>

Yazılarımızın rengi, tipi vs. özelliklerini tanımlayabileceğimiz etikettir. <font> etiketi bir satır içi etikettir.

<br>

Yazdığımız yazıların bir alt satıra devam etmesi için kullanılan etikettir. Kapanma etiketi yoktur. Günlük hayatımızda bilgisayar ortamında yazılarımızı yazarken alt satıra geçmek için enter tuşunu kullanırız ancak web dünyasında bu farklıdır. Bir yazıyı yazarken bir alt satıra yazdıklarınız çıktı sayfasında aynı satırda görünecektir. Bunun olmasının engellemek için yazının alt satıra geçmesini istediğiniz yere <br> etiketi koymalısınız.

<i>…</i>

Yazının italik görünmesini sağlar. <i> bir satır içi etikettir.

<b>…</b>

Yazının kalın görünmesini sağlar. <b> bir satır içi etikettir. Ayanı amaçla kullanılan bir diğer etiket ise <strong> ‘dur. Ancak <b> etiketi daha güncel ve daha kolay yazılabilir olması nedeniyle daha çok kullanılmaktadır.

<u>…</u>

Yazının altını çizer. <u> bir satır içi etikettir.

<a href=“LİNK”>…</a>

Yazımızın seçtiğimiz bir bölümüne link eklemek için kullanılan etikettir. Başlıkta “LİNK” yazan yere çift tırnak içerisinde yönlendirmek istediğimiz url’yi yazıyoruz. <a> bir satır içi etikettir.

<hr>

Sayfamıza satır boyunca bir çizgi çizer. Çizginin boyutu, rengi vs. ayarlanabilir.

Şimdi ise öğrendiklerimizi bir örnek ile pekiştirelim.

<html>
 <head>
   <title>Örnek 2</title>
 </head>
 <body>
   <h1>Başlık</h1>
   <p>
     Bu Paragrafın 1. Satırıdır <br> Burası paragrafın 2. Satırıdır. <br>
    <font color=red> Bu yazı font etiketi ile renklendirilmiştir. </font><br>
    <i> Bu yazı italiktir. </i><br>
    <b> Bu yazı kalınlaştırılmıştır. </b><br>
    <u> Bu yazının altı çizilmiştir. </u><br>
    <a href=“webgemisi.com”>Bu yazıya tıklayarak webgemisi.com adresine gidebilirsiniz.</a><br>
    <hr>
   </p>
 </body>
</html> 

Yukarıda yer alan örneği bir html dosyası olarak kaydedin. Daha sonra google üzerinden dosyamızı açıp bakalım.

Bir sonraki yazımızda görüşmek üzere…

Hakkında Furkan Yağmur

Check Also

web-gemisi

HTML Form Oluşturma 1. Kısım (Ders 9)

Bir web sayfasında formlar ile çalışmak için sadece html dilini bilmek yetmez. Bunun nedenini öğrenmek …

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir