Mhmet-Simsek.Tr.Gg
Icerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya GelcekIcerik Buraya Gelcek

M & Ş Media

cssfont

Font özellikleri sayfalarımızdaki metinlerin font ailesini, kalınlık ayarlarını,boyutunu, büyük-küçük harf olmasını ve stilini değiştirmemizi sağlar. CSS fontlar üzerinde tam hakimolmamızı sağlar.

 

 

  • color
  • font-family
  • font-size
  • font-weight
  • font-style
  • font-variant
  • font

color

Yapısı : color: <deger>
Aldığı Değerler :<renk> | inherit
Başlangıç değeri: web tarayıcısı belirler
Uygulanabilen elementler: tüm elementler
Kalıtsallık: Var

color metinlerimizin rengini tanımlamamız için kullanılır.

1 p{
2 color:#f00/* kırmızı renk kodu */
3 }

Renk kullanımına daha önce değinmiştik. Detay için tıklayınız.

Browser Uyumu:
Internet Explorer 3+
Netscape 4+
Opera 3.6+
W3C’s CSS Level 1+
CSS Profile 1.0

font-family

Yapısı : font-family : [[<font aile ismi > | <soysal aile ismi >],]* [<font aile ismi > | <soysal aile ismi >] | inherit
Aldığı Değerler :

<font aile ismi >- herhangi bir font ailesi ismi kullanılabilir.

<soysal aile ismi >

  • serif (örn: Times)
  • sans-serif (örn: Arial or Helvetica)
  • cursive (örn: Zapf-Chancery)
  • fantasy (örn: Western)
  • monospace (örn: Courier)

Başlangıç değeri: web tarayıcısı belirler
Uygulanabilen elementler: tüm elementler
Kalıtsallık: Var

Metinlerin kullanılacağı font ailesini belirlemek için kullanılır. Birden fazla fontailesi kullanılacaksa aralarına virgül (,) konur. Genelde son font ailesiolarak soysal font ailesi yazılır. Örnek:

1 p {
2 font-familyVerdanaArialHelveticasans-serif;
3 }

Eğer font ismi bir den fazla kelimeden olşuyorsa çift tırnak içine alınır.Örn:

1 h1 {
2 font-family: Georgia, "Times New Roman"serif;
3 }
Browser Uyumu:
Internet Explorer 3+
Netscape 4+
Opera 3.6+
W3C’s CSS Level 1+
CSS Profile 1.0

font-size

Yapısı :font-size: <kesin değerler > | <göreceli değerler > | <uzunluk> | <yüzde>
Aldığı Değerler :
  • <kesin değerler >
    • xx-small | x-small | small | medium | large | x-large | xx-large
  • <göreceli değerler >
    • larger | smaller
  • <uzunluk>
  • <yüzde> (üst elementlere(ebveyn) bağlı olarak)

Başlangıç değeri: medium
Uygulanabilen elementler: tüm elementler
Kalıtsallık: Var

CSS, Font boyutlandırmaya daha esnek tanımlama yapmamızı olanak sağladı. Mesela 11px değeri HTML’de2 ve 3 değeri arasında bir değer denk geliyor ve HTML font elementi ile birlikte kullanılamıyordu.CSS’de font boyutunu belirlemek için bir çok birim kullanılır. Örn: px, em,pt, in, cm vd.

01 td {
02 font-size :12px;
03 }
04 td {
05 font-size : 150%;
06 }
07 td {
08 font-size : xx-small;
09 }
10 td {
11 font-size : x-large;
12 }
Browser Uyumu:
Internet Explorer 3+
Netscape 4+
Opera 3.6+
W3C’s CSS Level 1+
CSS Profile 1.0

font-weight

Yapısı : font-weight: <değer>
Aldığı Değerler : normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 |800 | 900
Başlangıç değeri: normal
Uygulanabilen elementler: tüm elementler
Kalıtsallık: Yok

Fontun kalınlık incelik durumunu belirler. 100(ince)-900(kalın) arasında bir değer alabildiği gibi bold, bolder ve normal değerlerini de alır.

1 p{
2 font-weightbolder;
3 }
Browser Uyumu:
Internet Explorer 3+
Netscape 4+
Opera 3.6+
W3C’s CSS Level 1+
CSS Profile 1.0

font-style

Yapısı : font-style: <değer>
Aldığı Değerler : normal | italic | oblique | inherit
Başlangıç değeri: normal
Uygulanabilen elementler: tüm elementler
Kalıtsallık: Var

Fontun eğik(italiktik) olup olamamasını belirler.

1 p {
2 font-styleitalic;
3 }
4 h4{
5 font-styleoblique;
6 }
Browser Uyumu:
Internet Explorer 3+
Netscape 4+
Opera 3.6+
W3C’s CSS Level 1+
CSS Profile 1.0

font-variant

Yapısı : font-variant: <değer>
Aldığı Değerler :normal | small-caps | inherit
Başlangıç değeri: normal
Uygulanabilen elementler: tüm elementler
Kalıtsallık: Var

Metnin küçü-büyük harf ile gösterilmesini belirler. İki değer alır. normal | small-caps.

1 span {
2 font-variantsmall-caps;
3 }
Browser Uyumu:
Internet Explorer 4+
Netscape 6+
Opera 3.6+
W3C’s CSS Level 1+
CSS Profile 1.0

Türkçe karakterlerde sorun çıkardığı unutulmamalı

font

Yukardı anlatılan font özelliklerinin hatta ek olrak line-height değerinide tek sefer de tanımlamak için kullanılır. Bir kısaltmadır.

Yapısı : font: <değer>
Aldığı Değerler :[ <font-style> || <font-variant> || <font-weight> ]? <font-size> [ / <line-height> ]? <font-family>
Başlangıç değeri: tanımsız
Uygulanabilen elementler: tüm elementler
Kalıtsallık: Var
1 h2 {
2 fontbold italic 200%/1.2 VerdanaHelveticaArialsans-serif;
3 }
Browser Uyumu:
Internet Explorer 3+
Netscape 4+
Opera 3.6+
W3C’s CSS Level 1+
CSS Profile 1.0
© Mhmet-Simsek.Tr.Gg
Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
Ücretsiz kaydol