HTML Yazı Biçimi

WebMaster bölümünde yer alan bu konu SüKuN tarafından paylaşıldı.

  1. SüKuN

    SüKuN Harbi Aktif Üye

    html yazı kodları, yazı kodları html, html yazı kodu, yazı html kodları

    Yazı Biçimi

    Yazı Tarzları

    HTML'de harfleri koyu, eğik veya altı çizili yapmaya yarayan komutları görmüştük. Aşağıda hem daha önce gördüklerimiz, hem de yeni göreceğimiz kodlar yer alıyor:

    HTML:
    <b></b> *Harfleri koyulaştırır.(bold) 
    
    <strong></strong> *Harfleri koyulaştırır. 
    
    <big></big> *Harflerin boyutunu büyütür. 
    
    <small></small> *Harflerin boyutunu küçültür. 
    
    <em></em> *Harfleri eğik hale getirir.(emphasized) 
    
    <i></i> *Harfleri eğik hale getirir.(italic) 
    
    <sub></sub> *Harfleri alt simge haline getirir. (subscript) 
    
    <sup></sup> *Harfleri üst simge haline getirir. (superscript) 
    
    <del></del> *Harfleri üstü çizili hale getirir. (deleted) 
    
    <ins></ins> *Harfleri altı çizili hale getirir. (inserted) 
    
    <u></u> *Harfleri altı çizili hale getirir.(underlined) 
    HTML:
    <html> 
    <head> 
    <title>HTML Yazı Biçimi</title> 
    </head> 
    <body> 
    <b><b>:</b> trabzonsporun son <b>şampiyonluğunun</b> 100. yıl dönümünü kutlarız.<br/><br/> 
    <b><strong>:</b> trabzonsporun son <strong>şampiyonluğunun</strong> 100. yıl dönümünü kutlarız.<br/><br/> 
    <b><big>:</b> trabzonsporun son <big>şampiyonluğunun</big> 100. yıl dönümünü kutlarız.<br/><br/> 
    <b><small>:</b> trabzonsporun son <small>şampiyonluğunun</small> 100. yıl dönümünü kutlarız.<br/><br/> 
    <b><em>:</b> trabzonsporun son <em>şampiyonluğunun</em> 100. yıl dönümünü kutlarız.<br/><br/> 
    <b><i>:</b> trabzonsporun son <i>şampiyonluğunun</i> 100. yıl dönümünü kutlarız.<br/><br/> 
    <b><sub>:</b> trabzonsporun son <sub>şampiyonluğunun</sub> 100. yıl dönümünü kutlarız.<br/><br/> 
    <b><sup>:</b> trabzonsporun son <sup>şampiyonluğunun</sup> 100. yıl dönümünü kutlarız.<br/><br/> 
    <b><del>:</b> trabzonsporun son <del>şampiyonluğunun</del> 100. yıl dönümünü kutlarız.<br/><br/> 
    <b><ins>:</b> trabzonsporun son <ins>şampiyonluğunun</ins> 100. yıl dönümünü kutlarız.<br/><br/> 
    <b><u>:</b> trabzonsporun son <u>şampiyonluğunun</u> 100. yıl dönümünü kutlarız.<br/><br/> 
    </body> 
    </html>
    Font Formatı

    HTML'de fontların rengini, büyüklüğünü ve karakterini belirlemek için <font>...</font> kodundan ve bu kodun parametrelerinden yararlanırız.

    Font Büyüklüğü

    Fontların büyüklüğü için HTML; Word gibi piksel değil, kendince ölçü birimleri kullanır. (Tabi pixel veya point kullanması da söz konusu ama onları henüz anlatmayacağım. CSS derslerini bekleyin.) Fontların büyüklüğünü belirlemek için "size=" (ölçü) parametresi kullanılır. En küçük birim 1'e, en büyük birim ise 7'ye eşittir. Siz herhangi bir değer vermezseniz ("size" parametresini kullanmazsanız), HTML 3 birim büyüklüğünde fontlar kullanacaktır.

    HTML:
    <html> 
    <head> 
    <title>Fontların Boyutları</title> 
    </head> 
    <body> 
    <font size="1">Korktukça Tutsak, Umut Ettikçe Özgürsün!</font><br/><br/> 
    <font size="2">Korktukça Tutsak, Umut Ettikçe Özgürsün!</font><br/><br/> 
    <font size="3">Korktukça Tutsak, Umut Ettikçe Özgürsün!</font><br/><br/> 
    <font size="4">Korktukça Tutsak, Umut Ettikçe Özgürsün!</font><br/><br/> 
    <font size="5">Korktukça Tutsak, Umut Ettikçe Özgürsün!</font><br/><br/> 
    <font size="6">Korktukça Tutsak, Umut Ettikçe Özgürsün!</font><br/><br/> 
    <font size="7">Korktukça Tutsak, Umut Ettikçe Özgürsün!</font><br/><br/> 
    <font>Korktukça Tutsak, Umut Ettikçe Özgürsün!</font> 
    </body> 
    </html> 
    Yukarıdaki uygulamayla fontların 1'den 7'ye kadar tüm boyutlarını görebiliyoruz. Gözden kaçmaması gereken diğer bir nokta da şu: Son satırda "size" parametresini kullanmamıştık, bu nedenle HTML bu ifadeyi 3 birim boyutta yazdı. HTML'in fontlar için varsayılan (default) değerinin 3 olduğunu yazmıştık. Eğer siz ölçü birimi olarak -1 yazarsanız, HTML bunu 2 (varsayılan değerin bir eksiği) olarak algılar, +2 yazarsanız, HTML bunu 5 (varsayılan değerin 2 fazlası) olarak algılar.

    Font Rengi

    Bir başka <font> parametresi de "color" (renk) kodudur. Tahmin edeceğiniz üzere bu parametrenin işlevi fontların rengini belirlemektir. Fazla söze gerek yok, uygulamaya baksak yeterli olur di mi?

    HTML:
    <html> 
    <head> 
    <title>Fontların Renkleri</title> 
    </head> 
    <body> 
    <font color="blue">Biliyormusunuz dostlar.</font><br/> 
    <font color="red">Birkaç gündür boy boy,</font><br/> 
    <font color="purple">İlanlarım çıkıyor gazetelerde:</font><br/> 
    <font color="orange">Tipsiz ve kişiliksiz bir cüce</font><br/> 
    <font color="green">Kendine eş arıyor diye.</font><br/> 
    <font color="black">Ve mektuplar, mektuplar, mektuplar.</font><br/> 
    <font color="pink">Meğer ne kadar da çokmuş</font><br/> 
    <font color="brown">Etrafta kişiliksiz ve de tipsiz cüce</font><br/> 
    <br/> 
    <font color="crimson"><b>Orçun POLAT</b></font> 
    </body> 
    </html> 
    Tabi HTML bizi bildiğimiz İngizlizce renk isimleriyle kısıtlamamış, color parametresi çoğu bilgisayar yazılımlarının kabul ettiği RGB (red-green-blue) renk sistemini kabul etmiştir.

    Font Türü

    Fontların renklerini ve boyutlarını belirleyebiliyoruz artık. Sıra geldi fontların cinsini belirlemeye. O da yine <font> kodunun face parametresiyle belirleniyor. Burada önemli olan iki husus var. Birincisi, düşük sürümlü navigator'lar her fontu desteklemez (ama artık kimse düşük navigator'lı ikinci sınıf insanları iplemiyor), ikincisi ise internet kullanıcısının hard diskinde sizin belirlediğiniz fontlar yoksa, yazıları kendi bilgisayarının varsayılan font türü ile okur. Bu nedenle yaygın olmayan fontları kullanmamaya çalışın. Aşağıdaki uygulamada çok kullanılan font türlerinden örnekler verdim:

    HTML:
    <body> 
    <font face="Arial">Arial</font><br/> 
    <font face="Arial Black">Arial Black</font><br/> 
    <font face="Courier">Courier</font><br/> 
    <font face="Courier New">Courier New</font><br/> 
    <font face="Modern">Modern</font><br/> 
    <font face="Terminal">Terminal</font><br/> 
    <font face="Symbol">Symbol</font><br/> 
    <font face="Comic Sans">Comic Sans MS</font> 
    </body> 
    </html>

     
    Son düzenleme moderatör tarafından: 15 Eylül 2011