4.1 Xüsusiyyət font-style
CSS şriftləri və onların veb-səhifələrdə göstərilməsi üçün çoxlu xüsusiyyətlər təmin edir. font-style, font-variant və font-stretch xüsusiyyətləri mətnin üslubunu, göstərilməsini və enini tənzimləməyə imkan verir. Gəlin bu xüsusiyyətlərin hər birini ətraflı nəzərdən keçirək.
font-style xüsusiyyəti mətnin üslubunu müəyyən edir. Bu xüsusiyyət, mətni əyilmiş (kursiv) və ya adi stilə keçirmək üçün istifadə olunur.
Qiymətlər:
normal: adi mətn stili (default olaraq)italic: əyilmiş mətn (kursiv)oblique: italic ilə oxşar əyilmiş mətn, amma fərqli əyilmə üsulu ilə
İstifadə nümunəsi:
.normal {
font-style: normal;
}
.italic {
font-style: italic;
}
.oblique {
font-style: oblique;
}
<body>
<p class="normal">Bu adi mətn.</p>
<p class="italic">Bu əyilmiş mətn (kursiv).</p>
<p class="oblique">Bu əyilmiş mətn (oblique).</p>
</body>
4.2 font-variant Xüsusiyyəti
font-variant xüsusiyyəti mətni kiçik baş hərflərlə (capital) göstərməyi idarə edir. Bu, şriftin dəyişdirilməsini təmin edir ki, bütün hərflər böyük olsun, amma əslində kiçik olan hərflər daha kiçik ölçüdə olsun.
Dəyərlər:
normal: adi mətn (defolt olaraq)small-caps: kiçik baş hərflərlə mətn
İstifadə nümunəsi:
.normal {
font-variant: normal;
}
.small-caps {
font-variant: small-caps;
}
<body>
<p class="normal">Bu adi mətn.</p>
<p class="small-caps">Bu kiçik baş hərflərlə yazılmış mətn.</p>
</body>
Əlavə dəyərlər (CSS Fonts Level 4)
CSS Fonts Level 4 font-variant xüsusiyyəti üçün əlavə dəyərlər təqdim edir, məsələn, all-small-caps, petite-caps, all-petite-caps, unicase və titling-caps. Lakin onlar bütün brauzerlərdə dəstəklənmir.
4.3 font-stretch xüsusiyyəti
font-stretch xüsusiyyəti şriftin sıxılması və ya genişləməsi dərəcəsini idarə edir. Bu, şriftin hündürlüyünə təsir etmədən onu eninə dəyişir və uyğun şrift növünü seçmək üçün istifadə olunur, əgər mövcuddursa.
Qiymətlər:
normal: adi şrift eni (default qiymət)ultra-condensed: maksimum sıxılmış şriftextra-condensed: çox sıxılmış şriftcondensed: sıxılmış şriftsemi-condensed: orta dərəcədə sıxılmış şriftsemi-expanded: orta dərəcədə genişləmiş şriftexpanded: genişləmiş şriftextra-expanded: çox genişləmiş şriftultra-expanded: maksimum genişləmiş şrift
İstifadə nümunəsi:
.normal {
font-stretch: normal;
}
.condensed {
font-stretch: condensed;
}
.expanded {
font-stretch: expanded;
}
<body>
<p class="normal">Bu mətn normal şrift eni ilədir.</p>
<p class="condensed">Bu mətn sıxılmış şrift eni ilədir.</p>
<p class="expanded">Bu mətn genişləmiş şrift eni ilədir.</p>
</body>
GO TO FULL VERSION