CSS Yazı Tipleri

CSS Dersleri

• Ana Sayfa
• İletişim

CSS Yazı Tipleri Bu sayfada HTML sayfanızda kullandığınız yazıların yazı tipi özelliklerini nasıl değiştirebileceğiniz hakkında bilgi verilecektir. Yazı tiplerini biçimlendirirken en sık kullandığımız komutlar:

• font-family
• font-size
• font-style
• font-weight

font-family: Yazı Tipi Belirlemek

Yazı tipleri klasörümüzü açtığımızda birçok yazı tipi görürüz. Bunları HTML sayfamızda kullanmak için adını belirtmemiz gerekir. İşte bu kod yazı tipi seçmemizde bize yardımcı olacaktır.

CSS Kodu

h1 { font-family: Times New Roman; } p { font-family: Times New Roman, Arial, Helvatica; } a { font-family: Sans-serif; } Yukarıdaki birinci örnekte sadece tek yazı tipi adı belirttik (Times New Roman), ancak bir sonrakinde aralarına virgül koyarak daha fazla belirttik. Bu tarz kullanımlarda öncelikle dikkate alınan ilk verdiğimiz yazı tipi olacaktır. Eğer verdiğimiz yazı tipi o kullanıcıda yoksa bir sonraki ile görüntülenecektir.

font-size: Yazının Büyüklüğü (Puntosu)

Yazı büyüklüğünü font-size ile belirtiriz. Ölçü birimi olarak aşağıdakileri kullanabiliriz:

• % : yüzde olarak belirtmek
• in : inç olarak belirtmek
• cm : santim olarak belirtmek
• mm : milimetre olarak belirtmek
• em : varsayılan yazı büyüklüğüne göre oranlamak
• pt : punto olarak belirtmek
• px : piksel olarak belirtmek

Örneğin yazımızın 12 punto olması için yazmamız gereken komut:

CSS Kodu

h2 { font-size: 12pt; } 14 piksellik bir yüksekliğe sahip yazı istiyorsak:

CSS Kodu

h2 { font-size: 14px; } Varsayılan yazı tipinin %150 fazlasını EM ile belirtirsek:

CSS Kodu

h2 { font-size: 1.5em; } Yukarıdaki örneği yüzde ile ifade etmek isteseydik:

CSS Kodu

h2 { font-size: 150%; }

font-style: İtalik (Sağa Yatık) Yazmak

Yazımızın sağa yatık (italic) olması için aşağıdaki kodu kullanabiliriz.

CSS Kodu

h2 { font-style: italic; } Eğer italik bir yazıyı iptal edeceksek aşağıdaki kodu yazmalıyız:

CSS Kodu

h2 { font-style: normal; }

font-weight: Kalın Yazmak

Yazımızın kalın (bold) olmasını istiyorsak aşağıdaki kodu kullanmalıyız.

CSS Kodu

h2 { font-weight: bold; } Eğer kalın bir yazıyı normal haline dönüştüreceksek aşağıdaki kodu yazmalıyız:

CSS Kodu

h2 { font-weight: normal; }

• CSS Yazılar
• CSS Bağlantılar

Temel Bilgiler

CSS Nedir? CSS Kod Yapısı CSS ID ve Class Seçimi CSS Nasıl Eklenir?

CSS Stilleri

CSS Arkaplanlar CSS Yazılar CSS Yazı Tipleri CSS Bağlantılar CSS Listeleme CSS Tablolar

Kenarlıklar

CSS Kutu Modeli CSS Kenarlıklar (Border) CSS Dış Kenarlık (Outline) CSS Dıştan Boşluk (Margin) CSS İçten Boşluk (Padding)

CSS İleri Düzey

CSS Gruplama ve Üzerine Yazma CSS Sınırlamalar CSS Gösterme - Gizleme CSS Pozisyon Belirleme (position) CSS Kaydırma (float) CSS Hizalama (align) CSS Özel İfadeler (Pseudo) CSS Transparanlık (opacity) CSS Çıktı Türleri (media) CSS Özellik Seçimi (Attribute) CSS'ye Genel Bakış Facebook Sayfamız

Programlama Türkiye