2.1 font-family Xüsusiyyəti
Şriftlər veb-dizaynda açar rol oynayır, mətnin oxunaqlığına və vizual cazibədarlığına təsir edir. Şrift ailələri veb-səhifələrdə istifadə edilə bilən şriftlərin ümumi üslubunu və xüsusiyyətlərini müəyyən edir. CSS-də şriftlər adətən üç əsas ailəyə bölünür: serif, sans-serif və monospace. Bunların hər birini daha ətraflı nəzərdən keçirək.
font-family Xüsusiyyəti
font-family xüsusiyyəti şrift ailəsini müəyyən etmək üçün istifadə olunur. Bir neçə şrift qeyd edə bilərsiniz, onları vergüllə ayıraraq, beləliklə brauzer ilk şrift əlçatan olmadıqda növbəti siyahını istifadə edə bilsin.
Bir neçə şriftin istifadəsinə nümunə
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
İstifadəyə nümunə:
body {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
<body>
<p>Bu mətn Helvetica Neue, Helvetica və ya Arial şriftlərindən istifadə edilərək göstərilir.</p>
</body>
2.2 Serif şrift ailəsi
Serif (sans-serif olmayan) şriftlər hərflərin və simvolların sonlarına əlavə olunan kiçik xətlər və ya ştrixlərlə xarakterizə olunur. Bu şriftlər mətnə daha ənənəvi və rəsmi bir görünüş verir.
Serif şriftlərinə nümunələr:
- Times New Roman
- Georgia
- Garamond
- Baskerville
İstifadəyə nümunə:
body {
font-family: 'Times New Roman', serif;
}
<body>
<h1>Bu başlıqdır</h1>
<p>Bu serif şriftindən istifadə edərək yazılmış bir paraqrafdır.</p>
</body>
2.3 Sans-serif şrift ailəsi
Sans-serif (sans-serif) şriftləri hərflərin və simvolların sonunda kiçik xətlərin olmaması ilə fərqlənir. Bu şriftlər daha müasir və minimalistik görünür və ekranlarda yaxşı oxunaqlığına görə tez-tez veb-dizaynda istifadə olunur.
Sans-serif şriftlərinə misallar:
- Arial
- Helvetica
- Verdana
- Open Sans
body {
font-family: 'Arial', sans-serif;
}
<body>
<h1>Bu başlıqdır</h1>
<p>Bu, sans-serif şriftindən istifadə edən bir paragrafdır.</p>
</body>
2.4 Monospace şrift ailəsi
Eynixətli şriftlər (monospace) bütün simvollar üçün eyni eni təmin edir. Belə şriftlər tez-tez kodu, texniki sənədləri və cədvəlləri nümayiş etdirmək üçün istifadə olunur, burada simvolların şaquli olaraq düzgün yerləşməsi vacibdir.
Monospace şriftlərə nümunələr:
- Courier New
- Consolas
- Monaco
- Lucida Console
İstifadə nümunəsi:
body {
font-family: 'Courier New', monospace;
}
<body>
<h1>Bu başlıqdır</h1>
<p>Bu, eynixətli şrift istifadə edən bir paraqrafdır.</p>
<pre>
function helloWorld() {
console.log("Salam, dünya!");
}
</pre>
</body>
Veb səhifələrdə estetik görünüş və üslub müxtəlifliyi üçün tez-tez fərqli şrift ailələrinin birləşməsi istifadə olunur. Məsələn, başlıqlar serif şriftləri ilə tərtib edilə bilər, əsas mətn isə sans-serif şriftləri ilə. Amma kod həmişə monospace olur.
GO TO FULL VERSION