1 of 313 menu

Font-size сипаттамасы

font-size сипаттамасы мәтін қаріпінің өлшемін орнатады. Сипаттама мәні ретінде кез келген өлшем бірліктері (әдетте, бұл px, em немесе rem) немесе арнайы кілт сөздер (өте сирек қолданылады) қызмет етеді.

Синтаксис

селектор { font-size: мән; }

Кілт сөздер түріндегі мәндер

Мән Сипаттама
xx-small Ең ең кішкентай. Мысалы: Lorem ipsum dolor sit amet.
x-small Ең кішкентай. Мысалы: Lorem ipsum dolor sit amet.
small Кішкентай. Мысалы: Lorem ipsum dolor sit amet.
medium Орташа. Мысалы: Lorem ipsum dolor sit amet.
large Үлкен. Мысалы: Lorem ipsum dolor sit amet.
x-large Өте үлкен. Мысалы: Lorem ipsum dolor sit amet.
xx-large Ең үлкен. Мысалы: Lorem ipsum dolor sit amet.
larger Ата-анасының қаріпінен белгілі бір мәнге үлкен.
smaller Ата-анасының қаріпінен белгілі бір мәнге кіші.

Әдепкі мән: medium.

Мысал

Абзацтарға қаріп өлшемін 20px етіп орнатайық:

<p> Lorem ipsum dolor sit amet. </p> p { font-size: 20px; }

:

Мысал

Бұл мысалда абзац үшін өлшем 16px, ал оның ішіндегі span үшін - 150% деп берілген. Бұл жағдайда span үшін қаріп өлшемі өзінің ата-анасынан, яғни абзацтан 150% болады, және оның нақты өлшемі 16px * 150% = 24px болады:

<p> Lorem <span>ipsum dolor</span> sit amet. </p> p { font-size: 16px; } span { font-size: 150%; }

:

Мысал

Бұл мысалда абзац үшін өлшем 16px, ал оның ішіндегі span үшін - larger деп берілген. Бұл жағдайда span үшін қаріп өлшемі оның ата-анасынан (абзацтан) үлкен болады:

<p> Lorem <span>ipsum dolor</span> sit amet. </p> p { font-size: 16px; } span { font-size: larger; }

:

Мысал

Әр түрлі font-family және бірдей font-size бар қаріптер визуалды түрде мүлдем бір өлшемді болмауы мүмкін екеніне назар аударыңыз (бұл мәселені шешу үшін font-size-adjust сипаттамасын қараңыз).

Төмендегі мысалда екі абзацқа да font-size 16px деп берілген, бірақ әр түрлі font-family:

<p id="elem1"> Lorem ipsum dolor sit amet. </p> <p id="elem2"> Lorem ipsum dolor sit amet. </p> #elem1 { font-size: 16px; font-family: Arial; } #elem2 { font-size: 16px; font-family: "Times New Roman"; }

:

Қазақ
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItaliano日本語ქართული한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
Біз сайттың жұмысы, аналитика және персонализация үшін cookie файлдарын қолданамыз. Деректерді өңдеу Құпиялылық саясаты бойынша жүреді.
барлығын қабылдау баптау қабылдамау