سبک فونت (Font Style)
اینجا درباره «سبک فونت (Font Style)» حرف می زنیم. سبک یعنی حالت نمایش متن. مثلا معمولی، ایتالیک، یا مایل. همچنین، «وزن فونت (Font Weight)» و «گونه فونت (Font Variant)» را هم سریع یاد می گیریم.
CSS Font Style چیست؟
ویژگی «font-style» حالت متن را مشخص می کند. مقدارهایش سه تاست: normal یعنی معمولی؛ italic یعنی ایتالیک واقعی؛ oblique یعنی مایل مصنوعی و شبیه ایتالیک.
نمونه: normal / italic / oblique
p.normal {
font-style: normal;
}
p.italic {
font-style: italic;
}
p.oblique {
font-style: oblique;
}
گام های سریع برای تنظیم سبک فونت
- عنصر هدف را انتخاب کنید.
- font-style را روی normal یا italic بگذارید.
- در صورت نیاز، oblique را امتحان کنید.
- نتیجه را در مرورگرهای مختلف چک کنید.
CSS Font Weight چیست؟
«font-weight» یعنی ضخامت حروف. normal یعنی عادی، bold یعنی ضخیم. همچنین bolder، lighter و اعداد 100 تا 900 هم داریم. 400 معادل normal است و 700 معادل bold.
نمونه: وزن های مختلف
p.normal {
font-weight: normal;
}
p.light {
font-weight: lighter;
}
p.thick {
font-weight: bold;
}
p.thicker {
font-weight: 900;
}
CSS Font Variant چیست؟
«font-variant» تعیین می کند متن «حروف کوچکِ بزرگ شده» باشد یا نه. به این حالت می گوییم «Small Caps». حروف کوچک شبیه بزرگ می شوند، ولی کمی ریزتر.
نمونه: normal و small-caps
p.normal {
font-variant: normal;
}
p.small {
font-variant: small-caps;
}
نکته: برای سازگاری بهتر، حتما از جایگزین های فونت کمک بگیرید. همچنین قبلش فونت های وب سیف را بررسی کنید.
جمع بندی سریع
- سبک فونت حالت نمایش متن است.
- italic واقعی تر از oblique است.
- وزن با اعداد 100 تا 900 تنظیم می شود.
- Small Caps با font-variant فعال می شود.
- همیشه تست بین مرورگرها را فراموش نکنید.