Metin Formatlama Etiketleri
Bu bölümde web sayfamızda yer alan metin içeriklerini formatlamak için kullanabileceğimiz etiketleri inceleyeceğiz.
Font Etiketi (<font>...</font>)
Seçilen metnin formatlanması için kullanılan etiket çiftidir.
color Niteliği (<font color="...">...</font>)
Seçilen metnin rengini belirlemek için kullanılır.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
size Niteliği (<font color="...">...</font>)
Seçilen metnin büyüklüğünü belirlemek için kullanılır. Büyüklük 1 ile 7 arasında tanımlanabilir. Aksi belirtilmedi ise varsayılan font büyüklüğü 3 tür.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Font büyüklüğünü varsayılan sayfa fontunun büyüklüğüne göre göreceli atamak ta mümkündür.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
face Niteliği (<font face="...">...</font>)
Metnin fontunu belirtmek için kullanılır.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Belirtilen fontun sayfanın görüntülendiği bilgisayarda yüklü olmaması gibi durumlara karşı alternatif font belirleme imkanımız bulunmaktadır. Bunun için face niteliği içerisinde birbirlerinden virgüller ile ayrılmış bir biçimde birden fazla font adı yazarız.
En soldaki fonttan başlayarak kontrol edilir. Kullanılan bilgisayarda hangi font yüklü ise, ilgili içerik o font kullanılarak gösterilir.
Başlık Etiketleri (<h1>...</h1>)
İstenen metni başlık olarak formatlamak için kullanılır. Başlığımızı 6 farklı büyüklükte formatlayabiliriz.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Yatık Metin Etiketi (<i>...</i>)
Metnimizin belli bir kısmını yatık metin şeklinde yazmak istersek bu etiket çiftini kullanırız.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Kalın Metin Etiketi (<b>...</b>)
Metnimizin istediğimiz bölümünü kalan kısmına göre daha kalın karakterlerle vurgulamak istediğimiz durumda bu etiket çiftini kullanırız.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Küçük Etiketi (<small>...</small>)
Seçili metnin kalan diğer metinden daha küçük yazılmasını sağlamak için kullanılan etiket çiftidir.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Büyük Etiketi (<big>...</big>)
Seçili metnin kalan diğer metinden daha büyük yazılmasını sağlamak için kullanılan etiket çiftidir.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Altı Çizili Metin Etiketi (<u>...</u>)
Belirtilen metnin altı çizili bir şekilde yazılmasını sağlamak için kullanılan etiket çiftidir.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Üzeri Çizili Metin Etiketi (<strike>...</strike>)
Belirtilen metnin üzeri çizili bir şekilde yazılmasını sağlamak için kullanılan etiket çiftidir.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Java HTML Öğreniyorum
Alt Metin Etiketi (<sub>...</sub>)
Belirtilen metnin aynı satırda kalan diğer metne göre biraz daha aşağıda yazılmasını sağlar.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Üst Metin Etiketi (<sup>...</sup>)
Belirtilen metnin aynı satırda kalan diğer metne göre biraz daha yukarıda yazılmasını sağlar.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Blok Alıntı Etiketi (<blockquote>...</blockquote>)
Belirtilen metnin kalan diğer metne göre girintili bir biçimde yazılmasını sağlar.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Kod Etiketi (<code>...</code>)
Belirtilen metnin bilgisayar kodu şeklinde görüntülenmesini sağlar.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Formatlı Metin Etiketi (<pre>...</pre>)
Metnin ekranda, tüm boşluk ve satır sonu karakterleri ile beraber HTML kodu içerisinde nasıl yazıldıysa aynen gösterilmesi için bu etiket çifti kullanılır.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Font Etiketi (<font>...</font>)
Seçilen metnin formatlanması için kullanılan etiket çiftidir.
color Niteliği (<font color="...">...</font>)
Seçilen metnin rengini belirlemek için kullanılır.
<font color="red">HTML Öğreniyorum</font>
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
HTML Öğreniyorum
size Niteliği (<font color="...">...</font>)
Seçilen metnin büyüklüğünü belirlemek için kullanılır. Büyüklük 1 ile 7 arasında tanımlanabilir. Aksi belirtilmedi ise varsayılan font büyüklüğü 3 tür.
<font size="1">HTML Öğreniyorum</font><br/> <font size="2">HTML Öğreniyorum</font><br/> <font size="3">HTML Öğreniyorum</font><br/> <font size="4">HTML Öğreniyorum</font><br/> <font size="5">HTML Öğreniyorum</font><br/> <font size="6">HTML Öğreniyorum</font><br/> <font size="7">HTML Öğreniyorum</font><br/>
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
Font büyüklüğünü varsayılan sayfa fontunun büyüklüğüne göre göreceli atamak ta mümkündür.
<font size="-2">HTML Öğreniyorum</font><br/> <font size="-1">HTML Öğreniyorum</font><br/> <font>HTML Öğreniyorum</font><br/> <font size="+1">HTML Öğreniyorum</font><br/> <font size="+2">HTML Öğreniyorum</font><br/> <font size="+3">HTML Öğreniyorum</font><br/> <font size="+4">HTML Öğreniyorum</font><br/>
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
face Niteliği (<font face="...">...</font>)
Metnin fontunu belirtmek için kullanılır.
<font face="Arial">Arial</font><br/> <font face="Courier New">Courier New</font><br/> <font face="Times New Roman">Times New Roman</font><br/> <font face="Comic Sans MS">Comic Sans MS</font><br/>
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Arial
Courier New
Times New Roman
Comic Sans MS
Courier New
Times New Roman
Comic Sans MS
Belirtilen fontun sayfanın görüntülendiği bilgisayarda yüklü olmaması gibi durumlara karşı alternatif font belirleme imkanımız bulunmaktadır. Bunun için face niteliği içerisinde birbirlerinden virgüller ile ayrılmış bir biçimde birden fazla font adı yazarız.
<font face="Arial,Verdana,Helvetica">HTML Öğreniyorum</font><br/>
En soldaki fonttan başlayarak kontrol edilir. Kullanılan bilgisayarda hangi font yüklü ise, ilgili içerik o font kullanılarak gösterilir.
Başlık Etiketleri (<h1>...</h1>)
İstenen metni başlık olarak formatlamak için kullanılır. Başlığımızı 6 farklı büyüklükte formatlayabiliriz.
<h1>HTML Öğreniyorum</h1> <h2>HTML Öğreniyorum</h2> <h3>HTML Öğreniyorum</h3> <h4>HTML Öğreniyorum</h4> <h5>HTML Öğreniyorum</h5> <h6>HTML Öğreniyorum</h6>
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
HTML Öğreniyorum
Yatık Metin Etiketi (<i>...</i>)
Metnimizin belli bir kısmını yatık metin şeklinde yazmak istersek bu etiket çiftini kullanırız.
<i>HTML Öğreniyorum</i>
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
HTML Öğreniyorum
Kalın Metin Etiketi (<b>...</b>)
Metnimizin istediğimiz bölümünü kalan kısmına göre daha kalın karakterlerle vurgulamak istediğimiz durumda bu etiket çiftini kullanırız.
<b>HTML</b> Öğreniyorum
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
HTML Öğreniyorum
Küçük Etiketi (<small>...</small>)
Seçili metnin kalan diğer metinden daha küçük yazılmasını sağlamak için kullanılan etiket çiftidir.
<small>HTML</small> Öğreniyorum
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
HTML Öğreniyorum
Büyük Etiketi (<big>...</big>)
Seçili metnin kalan diğer metinden daha büyük yazılmasını sağlamak için kullanılan etiket çiftidir.
<big>HTML</big> Öğreniyorum
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
HTML Öğreniyorum
Altı Çizili Metin Etiketi (<u>...</u>)
Belirtilen metnin altı çizili bir şekilde yazılmasını sağlamak için kullanılan etiket çiftidir.
<u>HTML</u> Öğreniyorum
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
HTML Öğreniyorum
Üzeri Çizili Metin Etiketi (<strike>...</strike>)
Belirtilen metnin üzeri çizili bir şekilde yazılmasını sağlamak için kullanılan etiket çiftidir.
<strike>Java</strike> HTML Öğreniyorum
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Alt Metin Etiketi (<sub>...</sub>)
Belirtilen metnin aynı satırda kalan diğer metne göre biraz daha aşağıda yazılmasını sağlar.
HTML <sub>Öğreniyorum</sub>
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
HTML Öğreniyorum
Üst Metin Etiketi (<sup>...</sup>)
Belirtilen metnin aynı satırda kalan diğer metne göre biraz daha yukarıda yazılmasını sağlar.
HTML <sup>Öğreniyorum</sup>
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
HTML Öğreniyorum
Blok Alıntı Etiketi (<blockquote>...</blockquote>)
Belirtilen metnin kalan diğer metne göre girintili bir biçimde yazılmasını sağlar.
HTML Öğreniyorum. HTML öğrenmeye çalışanların düşüncelerini araştırdım, öğrendiklerim şöyle:
<blockquote>HTML öğrenmek hem çok kolay, hem de çok zevkli. Web sayfaları tasarlamak isteyen herkes bu dili öğrenmeli.</blockquote>
Bu yüzden ben de HTML öğrenmeye karar verdim.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
HTML öğrenmeye çalışanların düşüncelerini araştırdım, öğrendiklerim şöyle:
HTML öğrenmek hem çok kolay, hem de çok zevkli. Web sayfaları tasarlamak isteyen herkes bu dili öğrenmeli.Bu yüzden ben de HTML öğrenmeye karar verdim.
Kod Etiketi (<code>...</code>)
Belirtilen metnin bilgisayar kodu şeklinde görüntülenmesini sağlar.
Ekrana <code>HTML Öğreniyorum</code> yazdırdım.
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Ekrana
HTML Öğreniyorum yazdırdım.
Formatlı Metin Etiketi (<pre>...</pre>)
Metnin ekranda, tüm boşluk ve satır sonu karakterleri ile beraber HTML kodu içerisinde nasıl yazıldıysa aynen gösterilmesi için bu etiket çifti kullanılır.
<pre> Bu metin
ekrana aynen burada görüldüğü gibi
yazılacak </pre>
Bu şekilde formatlanan metin aşağıdaki şekilde görüntülenir.
Bu metin
ekrana aynen burada görüldüğü gibi
yazılacak
Bu sayfada öğrendiğimiz etiket ve niteliklerden oluşan HTML sayfamızın bir örneği
aşağıdaki şekildedir:
<html>
<head>
<meta charset="utf-8" />
<meta name="keywords" content="HTML,tags,etiketler,metin formatlama">
<title>Metin Formatlama Etiketleri</title>
</head>
<body>
<font color="red">Kırmızı metin</font>
<br />
<font size="1">Font 1</font>
<br />
<font size="2">Font 2</font>
<br />
<font size="3">Font 3</font>
<br />
<font size="4">Font 4</font>
<br />
<font size="5">Font 5</font>
<br />
<font size="6">Font 6</font>
<br />
<font size="7">Font 7</font>
<br />
<font size="-2">HTML Öğreniyorum</font>
<br />
<font size="-1">HTML Öğreniyorum</font>
<br />
<font>HTML Öğreniyorum</font>
<br />
<font size="+1">HTML Öğreniyorum</font>
<br />
<font size="+2">HTML Öğreniyorum</font>
<br />
<font size="+3">HTML Öğreniyorum</font>
<br />
<font size="+4">HTML Öğreniyorum</font>
<br />
<font face="Arial">Arial</font>
<br />
<font face="Courier New">Courier New</font>
<br />
<font face="Times New Roman">Times New Roman</font>
<br />
<font face="Comic Sans MS">Comic Sans MS</font>
<br />
<font face="Arial,Verdana,Helvetica">HTML Öğreniyorum</font><br />
<h1>HTML Öğreniyorum</h1>
<h2>HTML Öğreniyorum</h2>
<h3>HTML Öğreniyorum</h3>
<h4>HTML Öğreniyorum</h4>
<h5>HTML Öğreniyorum</h5>
<h6>HTML Öğreniyorum</h6>
<i>HTML Öğreniyorum</i>
<br /><br />
<b>HTML</b> Öğreniyorum
<br /><br />
<small>HTML</small> Öğreniyorum
<br /><br />
<big>HTML</big> Öğreniyorum
<br /><br />
<u>HTML</u> Öğreniyorum
<br /><br />
<strike>Java</strike> HTML Öğreniyorum
<br /><br />
HTML <sub>Öğreniyorum</sub>
<br /><br />
HTML <sup>Öğreniyorum</sup>
<br /><br />
HTML öğrenmeye çalışanların düşüncelerini araştırdım, öğrendiklerim şöyle:<blockquote>HTML öğrenmek hem çok kolay, hem de çok zevkli. Web sayfaları tasarlamak isteyen herkes bu dili öğrenmeli.</blockquote>
Bu yüzden ben de HTML öğrenmeye karar verdim.
<br /><br />
Ekrana <code>HTML Öğreniyorum</code> yazdırdım.
<br /><br />
<pre>
Bu metin
ekrana aynen burada görüldüğü gibi
yazılacak
</pre>
</body>
</html>
| << Yatay Çizgi Ekleme << | >> >> |
Yorumlar
Yorum Gönder