Bootstrap 4 Tipografi(Yazı türleri)

Bootstrap 4 yazı ve yazı tipleri'nde(typography) varsayılan değerler yazı büyüklüğü 16px satır yüksekliği 1,5 olarak kullanılmaktadır.
Varsayılan yazı tipi olarak sırasıyla Helvetica Neue, Helvetica, Arial, sans-serif kullanılmaktadır.
HTML'de başlık için kullanılan h1 - h6 etiketleri Bootstrap4'te de aynı şekilde kullanılmaya devam edilebilir. Ek olarak başlıklar .display-1 den .display-4 e kadar yeni özellikler eklenerek daha farklı bir yazı ve daha büyük başlıklar elde edilebilir.
Örnek :

<h1 class="display-1">Display-1 Başlık</h1> gibi.

Boostrap4'te başlık yanına yazılan kısa yazılar(slogan gibi) için kullanılan small etiketi yazı kalınlığını azaltır, yazı büyüklüğünü düşürürerek farklı bir görünüm elde etmek için kullanılabilir.
small etiketi için herhangi bir class değeri vermeye gerek yoktur.

HTML'de ipuçları için kullanılan abbr etiketi de Bootstrap4 ile daha şık bir görünüm kazanmıştır. Genellikle kısaltmaları açıklamak için kullanılan abbr etiketi ile istenilen kelimenin altı çizilir ve açıklaması title parametresinin için de yazdırılır.
abbr etiketi için herhangi bir sınıf özelliği eklemeye gerek yoktur. Örnek:

<abbr title="Türkiye Büyük Millet Meclisi">TBMM</abbr> 23 Nisan 1920'de açılmıştır.
TBMM 23 Nisan 1920'de açılmıştır.

HTML' de bilgisayar kodlarını yazarken code etiketlerinin arasında yazılması daha doğru olacaktır. Bootstrap4'te bu code etiketleri için de biçimlendirme özellikleri mevcuttur.Kaynak kodu indirdiğinizde örnekleri bulabilirsiniz.

HTML' de klavye kısayollarını yazarken kbd etiketleri kullanılır. Bootstrap4'te bu kbd etiketleri için de biçimlendirme özellikleri mevcuttur.Kaynak kodu indirdiğinizde örnekleri bulabilirsiniz.

HTML'de eğer uygun etiketler kullanılmazsa yazılan yazılar arasında en fazla 1 karakter boşluk oluşturulur ve sadece satır sonlarında bir alt satıra geçilebilir. Ancak bazen yazıları kod içinde yazdığınız gibi tüm boşlukları ve satır sonları ile ekranda görüntülemek isteyebilirsiniz. Bunun için pre etiketleri kullanılır. Bootstrap4'te bu pre etiketleri için de biçimlendirme özellikleri mevcuttur.Kaynak kodu indirdiğinizde örnekleri bulabilirsiniz.


Yorumlar


Yorum yapabilmek ve kaynak kodları indirebilmek için lütfen üye girişi yapın

Hakkımızda

Bu site, website tasarımı yapılırken frontend(ön yüz) teknolojileri hakkında kısa anlatım ve örnekler paylaşmak amacıyla hazırlanmıştır.

Web tasarımda şu an için en sık kullanılan dil ve frameworkler HTML, CSS, JQUERY ve BOOTSTRAP olması sebebiyle bu alanların üzerinde örnekler ve çalışmalar olacaktır.

Son Yorumlar

İletişim

  • info@frontendokulu.com