HTML Biçimlendirme

HTML Dersleri

HTML Biçimlendirme

Biçimlendirme

Web sayfalarındaki en temel unsurlardan biride metinlerdir. Bu dersimizde HTML sayfamızdaki metinleri biçimlendirirken (kalınlık, italik yazma, vurgu, vb.) kodlardan nasıl yararlanabileceğimizi göreceğiz.

 ve etiketleri : Kalın veya italik metin gibi, biçimlendirme çıkışı için ve etiketleri kullanır.

 etiketi : Yine etiketi gibi kalın olarak biçimlendirme çıkışı sağlar. Fakat ve etiketleri, okuyucu için sayfayı tarayıcıda görsel olarak izlerken herhangi bir farklılık yaratmamasına karşın ikisi de sonuçta yazının kalın görünmesini sağlar. Ayrıldıkları nokta şudur etiketi sadece yazının stilini değiştirir. etiketi ise, yazının stilini değiştirmekle kalmayıp, ona önem katar. Arama motorları sayfayı indekslerken takıları arasındaki kelimelerin, diğer kelimeler ile karşılaştırıldığında daha önemli olduğunu varsayar. Aynı şekilde, sayfayı bir okuma yazılımına okutursanız, takıları arasındaki kelimeleri daha yüksek sesle okuduğunu görebilirsiniz. Diğer yandan takısının böyle bir işlevi yoktur, tek yaptığı yazıyı kalın göstermedir.

 (emphasize) etiketi : İçerdiği metnin italik gösterilerek öneminin vurgulanmasını sağlar.

<code> etiketi : İçerdiği metnin bilgisayar kod parçası olduğunu belirtir. etiketi gibi metin bloklarının içinde kullanılması durumunda blok ile uyumlu gösterilerek, metni kesintiye uğratmaz. İçerdiği metin sabit genişlikli yazı tipi ile gösterilir.

 (subscript) ve (superscript> etiketleri : İçerdiği metnin güncel fontun ufak puntosu ile normal karakterlerin biraz altında alt yazı olarak gösterilmesini sağlar. Aynı şekilde kullanımı satır yüksekliğini normal karakterlerin biraz üstünde bir üst yazı olarak gösterilmesini sağlar.

Etiketlerin bir arada kullanım örneği

<html>

<head>
<title> metin bicimlendirme etiketleri </title>
</head>

<body>
<p><b>Kalın bir metin</b></p>
<p><strong>Güclü bir metin</strong></p>
<p><i>Saga yatık bir metin</i></p>
<p><em>Vurgulanmis bir metin</em></p>
<p><code>Programlama dili metni</code></p>
<p>Bu metin<sub> altsimge</sub> ve <sup>üst simge</sup></p>
</body>

</html>

HTML Görünümü

Kalın bir metin
Güclü bir metin
Saga yatık bir metin
Vurgulanmis bir metin
Programlama dili metni
Bu metin_altsimge ve ^{üst simge}

Metin Biçimlendirme Etiketleri

<b> Kalın Metin
<em> Vurgulanmış Metin
<i> İtalik Metin
<small> Küçük Yazı
<strong> Güçlü Metin
<sub> Alt hizada yazmak
<sup> Üst hizada yazmak
<ins> Altı çizgili metin
<del> Üstü çizgili metin
<mark> İşaretlenmiş metin

Programlama Dilleri Etiketleri

<code> Programlama dili metini
<kbd> Klavye metini
<samp> Örnek bilgisayar kodu metni
<tt> Tele tip metin
<var> Değişken
<pre> Biçimlendirilmemiş metin

HTML Atıf, Alıntı ve Tanım Etiketleri

<abbr> Kısaltma
<acronym> Baş harfleri ile kısaltma
<address> Adres öğesi
<bdo> Metin yönü
<blockquote> Uzun alıntı
<q> Kısa alıntı
<cite> Alıntı
<dfn> Tanımlama terimi

 etiketi : Bir alt satıra geçmeyi sağlamaktadır. Bu etiket kullanılmazsa tüm yazılar ve nesneler yatay bir şekilde ard arda gelecektir. Şimdi, HTML p etiketi ile oluşturduğumuz bir paragraf içinde br etiketi kullanarak satır başı yapılmasını sağlayalım.

<p>Burası birinci satır.<br />Burası ikinci satır</p>

HTML Görünümü

Burası birinci satır.
Burası ikinci satır

  etiketi kullanıldığı yerde satırın sonunun geldiğini bildiriyor ve gelecek olan kodun bir alt satırdan başlamasını sağlıyor, bir anlamdan " Enter " tuşunun görevini yapıyor.

Sayfalar