Css Arkaplan Özellikleri (Css Background)
Css Metin Özellikleri
 

Css Font Özellikleri

Font özellikleri web sayfasındaki metinlerin yazı tipi, boyutu, kalınlık ayarları gibi özelliklerini değiştrmek için kullanılır.

Özellik Açıklama
font-family Bu özellik bir metne ait yazı tipini seçmek için kullanılır.
font-size Metnin boyutunu ayarlamak için kullanılır.
font-weight Metnin kalınlık, incelik ayarlarının yapılmasını sağlar
font-style Metni eğik yada normal yapmak için kullanılır.
line-height Metin içindeki satırların arasındaki mesafeyi ayarlamak için kullanılır.
font Fonta ait özelliklerin kısa yazımı için kullanılır.

 

 

Font-family

“font-family” özelliği, bir metne ait font ailesini belirlemeye yarar. Bunu yaparak yazı tipimizi seçmiş oluruz. Bu özellik birden fazla font ailesi ismi içerebilir, her font ailesi ismi virgülle ayrılır.

Örnek 1:

p { font-family: Verdana, Arial, Helvetica, sans-serif; } 

Yukarıdaki örnekte tarayıcı ilk önce Verdana yazı tipinin tarayıcı tarafından desteklendiğine bakacaktır. Desteklenmediği takdirde sırayla diğerlerini deneyecektir.

Örnek 2:

h1 { font-family: Georgia, "Times New Roman", serif; } 

Bu örnekte ise görüldüğü üzere “Times New Roman” tırnak içine alınmıştır. Eğer bir font ailesinin adı bir kelimeden fazla ise tırnak işaretleri içine alınmalıdır.

 

 

Font-size

Metnin boyutunu ayarlamak için kullanılır. Boyut piksel(px)" , yüzde(%) ve ya (em) olarak belirtilebilir.

Örnek :

body {font-size:100%;} /*varolan font boyutunun tamamını(%100) kullan. */
h1 {font-size:2.5em;} /*h1 için font boyutu(2.5em=2.5*16px =40px)belirler. */
h2 {font-size:25px;} /*h2 için font boyutu(25px) belirler.*/

 Metin boyutunu ayarlamak için aşağıdaki değerlerde kullanılabilir.

Değer Açıklama
medium Font boyutunu medium olarak ayarlar.
xx-small Font boyutunu xx-small olarak ayarlar.
x-small Font boyutunu x-small olarak ayarlar.
small Font boyutunu small olarak ayarlar.
large Font boyutunu large olarak ayarlar.
x-large Font boyutunu x-large olarak ayarlar.
xx-large Font boyutunu xx-large olarak ayarlar.
smaller Font boyutunu parent (bir üst) elementin metin boyutundan daha küçük olarak ayarlar.
larger Font boyutunu parent (bir üst) elementin metin boyutundan daha büyük olarak ayarlar.
length Font boyutunu , px, cm gibi sabit bir boyutta ayarlar.
% Font boyutunu, parent elementin boyutunun yüzdesi olarak ayarlar.
initial Font boyutunu, varsayılan boyuta ayarlar.
inherit Font boyutunu, parent elementin boyutuyla aynı olacak şekilde ayarlar.

 

 

 Font-weight

Fontun kalınlık, incelik değerini belirlemeye yarar.  bold, bolder, normal ve lighter değerlerini alabilir.

Örnek: p etiketi içinde yer alan yazının tamamının kalın yazılması için aşagıdaki gibi kullanılabilir.

p{ font-weight: bold; }

 

 

Font-style

Metni eğik (italik), az eğik veya normal yapmak için kullanılır.

p { font-style:normal; } /* Metin normal görünür. 
p { font-style:italic; } /* Metin italik yani eğik yazı olarak görünür. */
p { font-style:oblique; } /* Metin az eğik görünür(Çok fazla desteklenmez.)*/

 

 

Line-height

Metin içindeki satırların arasındaki mesafeyi ayarlamak için kullanılır.

Örnek:

p{ line-height: 15px;} /*Satırlar arası mesafeyi 15 px yapar.*/

 

 

 

Font

Kısaltma işlemini yaparken aşağıdaki söz dizimi kullanılır:

      font: font-style font-weight font-size/line-height font-family;

Örnek:

p {
font: bold 12px/15px verdana, sans-serif;
}

 

Ekleyen:admin

Adınız
:
Eposta
:



Resmi Degistir


vuhuv.com.tr