26 Aralık 2017 Salı

Css Yazı Tipleri

Css'de bir değil önemli konu ise yazı tipleridir.Sitemizi css ile tasarlarken yazı tiplerimizi nasıl değiştirceğiz hep birlikte bakalım arkadaşlar.

İlk olarak yazı tiplerini değiştirmede kullanılan komutları sırayalalım ve daha sonra hepsini açıklayalım


  1. font-family
  2. font-size
  3. font-style
  4. font-weight


1-)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.

      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.

2-) Font-Size: Yazının Büyüklüğü

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:

      h2 { font-size: 12pt; }
   

3-Font-Style: İtalik Yazmak

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

      h2 { font-style: italic; }

   

Eğer italik bir yazıyı iptal edeceksek aşağıdaki kodu yazmalıyız:

      h2 { font-style: normal; }

   

4-)Font-Weight: Kalın Yazmak

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

      h2 { font-weight: bold; }

   

Eğer kalın bir yazıyı normal haline dönüştüreceksek aşağıdaki kodu yazmalıyız:

      h2 { font-weight: normal; }

   


Daha detaylı olarak aşağıdaki videoyu izleyebilirsiniz.


Hiç yorum yok:

Yorum Gönder

WEB TASARIM'DA PÜF NOKTALAR

Web sitesi tasarımınıza başlamadan önce, siteniz ile ilgili bir ön hazırlık yapmanız siteninizin çok daha iyi olmasına sebep olur. S...