توصیف گر font-style

توصیف گر font-style

به عنوان یک توصیف گر٬ font-style این اجازه رو به طراح می دهد که یک face خاص رو به یک مقدار خاص از font-style مربوط کند.

@font-face {
       font-family: "SwitzeraADF";
       font-style: normal;
       src: url("SwitzeraADF-Regular.otf") format("opentype");
    }
    @font-face {
       font-family: "SwitzeraADF";
       font-style: italic;
       src: url("SwitzeraADF-Italic.otf") format("opentype");
}
@font-face {
       font-family: "SwitzeraADF";
       font-style: oblique;
       src: url("SwitzeraADF-Italic.otf") format("opentype");
}

با توجه به قطعه کد٬ خروجی قوانین این خواهد بود که با استفاده از آن در ادامه طراحی مثلا عناصر h2 و h3 از فونت SwitzeraADF-Italic به جای فونتSwitzeraADF-Regular استفاده می کنند.

h1, h2, h3 {font: 225% SwitzeraADF, Helvetica, sans-serif;}
    h2 {font-size: 180%; font-style: italic;}
    h3 {font-size: 150%; font-style: oblique;}

توصیف گر font-style

البته اگر یک face از فونت با حالت oblique وجود داشت٬ نویسنده می توانست به جای استفاده از فونت italic از همان نوع فونت oblique هم استفاده کند.

وقتی ما با استفاده از یک descriptor برای یک چهره از فونتمون سبک خاصی رو تعیین میکنیم٬ در طزاحی٬ هرجا از اون سبک خاص استفاده کنیم٬ همون چهره خاص از فونت به کار برده می شود.

تمام مرورگرهای اصلی، خصوصیت font-style را پشتیبانی می کنند.  مرورگر Internet Explorer 7 و نسخه های قبلی آن، مقدار “inherit” را پشتیبانی نمی کند. IE8 به !DOCTYPE! نیاز دارد. IE9 مقدار “inherit” را پشتیبانی می کند.

این هم از این 😉

موفق و موید باشید.

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *