“Anın tadını çıkarıyordum.Tıpkı paraşütü açılmayan bir paraşütçünün rüzgarın tadını çıkarttığını gibi“

Halimclskn

cssders4

Ders 4: Fontlar

Bu derste yazı tipleri hakkında ve bunların nasıl CSS kullanılarak uygulanır öğreneceksiniz. Biz de yazı web sitesine erişmek için kullanılan PC yüklenip yüklenmediğini bir web sitesi için seçilen özel yazı tipleri yalnızca görülebileceği soruna nasıl bakacağız.Aşağıdaki CSS özellikleri tarif edilecektir:

Yazı ailesi [font-family]

Mülkiyet font-family Belli bir eleman veya web sayfasını görüntülemek için kullanılacak yazı tiplerinin öncelik listesini ayarlamak için kullanılır. Listedeki ilk yazı sitesine erişmek için kullanılan bilgisayarda yüklü değilse uygun bir yazı bulunana kadar, listedeki bir sonraki yazı yargılanacak.

Aile adları ve genel aileleri: yazı kategorize etmek için kullanılan isimlerinin iki çeşidi vardır. İki terimler aşağıda açıklanmıştır.

Aile adı
Bir aile adı (genellikle "yazı" olarak bilinir) örnekleri örneğin "Arial", "Times New Roman" veya "Tahoma" olabilir.
Genel aile
Genel ailelerin iyi üniformalı görünümlere sahip aile adı grupları olarak tanımlanabilir. Örnek bir "ayak" olmadan yazı bir koleksiyon sans-serif vardır.

Farkı da bu gibi gösterilebilir:

Üç jenerik aile örnekleri ve bunların aile üyelerinden bazılarının

Web sitesi için yazı tiplerini listelemek zaman, doğal olarak bazı alternatif yazı tipleri takip en çok tercih edilen yazı ile başlar. Bu genel bir font ailesi ile listeye tamamlamak için tavsiye edilir. Bu şekilde belirtilen yazı hiçbiri varsa en azından sayfa aynı ailenin bir yazı tipi kullanılarak gösterilecektir.

Fontların bir öncelik listesi örneği şu şekilde olabilir:

	  	h1 {font-family: arial, verdana, sans-serif;}  	h2 {font-family: "Times New Roman", serif;}  	  	

Ile işaretlenmiş Başlıkları <h1> yazı tipi "Arial" ile gösterilir. Bu yazı tipi kullanıcının bilgisayarında yüklü değilse, "Verdana" yerine kullanılır. Bu yazı hem kullanılamıyorsa, bir yazı tipi sans-serif aile başlıklarını göstermek için kullanılır.

Yazı tipi adını "Times New Roman" boşluk içerir ve bu nedenle tırnak işaretleri kullanılarak listelenir dikkat edin.

Yazı stili [font-style]

Mülkiyet font-style ya seçilen yazı tipi tanımlar , normal , italik ya da eğik . Aşağıdaki örnekte, işaretlenmiş tüm başlıkları<h2> italiklerle gösterilmiştir edilecektir.

	  	h1 {font-family: arial, verdana, sans-serif;}  	h2 {font-family: "Times New Roman", serif; font-style: italic; }  	  	

Yazı varyantı [font-variant]

Mülkiyet font-variant arasında seçim için kullanılır , normal veya küçük-büyük harf , bir yazı varyantları. Bir küçük-büyük harf yazı tipi küçük ölçekli harfle harfleri (büyük harf) yerine küçük harf kullanan bir yazı tipidir. Aklınız mı karıştı? Bu örnekler bir göz atın:

Küçük harf fontları dört örnek

Eğer font-variant ayarlanır , küçük-büyük harf ve hiç de küçük-büyük harf yazı mevcuttur tarayıcı büyük olasılıkla yerine büyük metin gösterecektir.

	  	h1 {font-variant: small-caps;}  	h2 {font-variant: normal;}  	  	

Yazı [font-weight]

Mülkiyet font-weight bir yazı nasıl sunulacağını kalın ya da "ağır" anlatılmaktadır. Bir yazı tipi olabilen , normal veya kalın .Bazı tarayıcılar bile yazı ağırlığı tarif etmek için 100-900 arasındaki numaralar kullanımı (yüzlerce) destekler.

	  	p {font-family: arial, verdana, sans-serif;}  	td {font-family: arial, verdana, sans-serif; font-weight: bold; }  	  	

Yazı boyutu [font-size]

Bir yazı tipi boyutu özelliği ile ayarlanan font-size .

Font boyutları tanımlamak için seçebileceğiniz birçok farklı birimler (örneğin piksel ve yüzdeler) vardır. Bu yazıda en yaygın ve uygun birimler üzerinde durulacak. Örnekleri şunlardır:

	  	h1 {font-size: 30px ;}  	h2 {font-size: 12pt ;}  	h3 {font-size: 120% ;}  	p {font-size: 1em; }  	  	

Yukarıda dört birimleri arasında bir temel fark var. Birimleri ' px 've' pt 'while', yazı tipi boyutunu mutlak hale % 've' em Eş o / o uygun gördüğünüz gibi kullanıcı yazı tipi boyutunu ayarlamak için izin verir. Birçok kullanıcı devre dışı bırakılır, sadece yaşlı veya görme veya kötü kaliteli bir monitör muzdarip. web erişilebilir kılmak için herkes için, bu tür 'olarak ayarlanabilir birimleri kullanmalıdır % 'ya da' em '.

Aşağıda Mozilla Firefox ve Internet Explorer metin boyutunu ayarlamak için nasıl bir örnek görebilirsiniz. Kendiniz deneyin - özellik düzgün, değil mi?

g

[Font] Derleme

Kullanarak yazı kısa el özellik ise tek bir özelliği tüm farklı yazı tipi özelliklerini karşılamak mümkündür.

Örneğin, yazı tipi-özelliklerini tanımlamak için kullanılan kod bu dört satırları hayal <p> :

	  	p {  		font-style: italic;  		font-weight: bold;  		font-size: 30px;  		font-family: arial, sans-serif;  	}  	  	

Kısa el özelliğini kullanarak, kod basitleştirilmiş olabilir:

	  	p {  		font: italik, kalın 30px arial, sans-serif;  	}  	  	

Değerlerinin sırayla yazı şöyledir:

font-style | font-variant | font-weight | font-size | font-family

Özet

Artık yazı ile ilgili olasılıklar bazıları hakkında öğrendim. Yazı tiplerini belirtmek için CSS kullanarak en önemli avantajlarından biri herhangi bir zamanda, sadece birkaç dakika içinde bütün bir internet sitesinde yazı tipini değiştirebilir olduğunu unutmayın. CSS zaman tasarrufu ve hayatınızı kolaylaştırır. In sonraki derste biz metin bakacağız.

sponsor alanlar veya bağlantılar

popüler yazılar

  • Android sunucu çöktü!
    Bu nasıl olduğu harbiden bilinmemekle beraber kimse harbiden bilinmemekle beraber kimse harbiden bilinmemekle beraber kimse
    + devamını oku

  • Android sunucu çöktü!
    Bu nasıl olduğu harbiden bilinmemekle beraber kimse harbiden bilinmemekle beraber kimse harbiden bilinmemekle beraber kimse
    + devamını oku

  • Android sunucu çöktü!
    Bu nasıl olduğu harbiden bilinmemekle beraber kimse harbiden bilinmemekle beraber kimse harbiden bilinmemekle beraber kimse
    + devamını oku

hakkımda

istatistik

kopirayt

Lorem Ipsum kullanmanın amacı, sürekli 'buraya metin gelecek, buraya metin gelecek' yazmaya kıyasla daha dengeli bir harf dağılımı sağlayarak okunurluğu artırmasıdır. aşamasında olan çok sayıda site listelenir. Yıllar içinde, bazen kazara, bazen bilinçli olarak (örneğin mizah katılarak)
Sitede toplam 36 yazı bulunmaktadır ayrıca 86 yorum ve 9 kategori bulunuyor bugün hava güneşli ama normal sayılır yani.
Sitemde yazılan , çizilen , eklenenlerin telif hakkı vs yoktur.Ç(alıntı) yapacaklarında kaynak göstermesi yeterlidir.Bakın dürüstüm size karşı "lütfen" çalmayın.

Çizen: Sefa Uygun
HTML/CSS: Tugay Tekeci - yapiyoruz.tr.gg
Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
Ücretsiz kaydol