ویژگی font-face@ در css | تعریف فونت دلخواه سی اس اس

در این مقاله از سایت آموزی جهت استفاده شما همراهان گرامی قصد داریم در مورد صفت font-face@ در زبان css توضیحاتی را ارائه نماییم.

ویژگی font-face@ در سومین نسخه زبان طراحی css یعنی CSS3 معرفی شده است.

ویژگی font-face@ در css | تعریف فونت دلخواه سی اس اس

معرفی ویژگی کاربردی font-face@ در زبان طراحی سی اس اس

توسط خاصیت font-face@ می توانیم فونت های دلخواه و سفارشی را در زبان سی اس اس تعریف کنیم.

از طریق این ویژگی می توانیم فونت هایی به غیر از فونت های نصب شده روی سیستم کاربر در صفحه وب برای کاربر به نمایش در بیاوریم.

در داخل خصوصیت font-face@ می توان چندین ویژگی دیگر فونت که حاوی اطلاعاتی برای فونت سفارشی هستند را جای داد.

این مقادیر اطلاعاتی از قبیل منبع فونت ، ضخامت فونت ، استایل فونت ، کشیدگی فونت و یونیکد و … را در خود جای می دهد.

مقادیر صفت کاربردی font-face@ در زبان طراحی سی اس اس

صفت کاربردی font-face@ که در زبان طراحی CSS3 معرفی شده است، 6 مقدار می پذیرد که عبارتند از:

  1. مقدار font-family
  2. مقدار src
  3. مقدار font-style
  4. مقدار font-stretch
  5. مقدار font-weight
  6. مقدار unicode-range

ویژگی font-face@ در css | تعریف فونت دلخواه سی اس اس

مقدار font-family درون خاصیت font-face@ در زبان سی اس اس

اگر خاصیت font-face@ را برابر با مقدار font-family قرار دهیم، یعنی می خواهیم در این حالت اسم فونت سفارشی یا دلخواه را تعیین کنیم.

مثال براساس مقدار font-family برای خاصیت font-face@

مقدار src درون خاصیت font-face@ در زبان سی اس اس

اگر خاصیت font-face@ را برابر با مقدار src قرار دهیم، یعنی می خواهیم آدرس منبع فونت سفارشی آپلود شده در ریشه سایت را تعیین نماییم.

مثال براساس مقدار src برای خاصیت font-face@

مقدار font-style درون خاصیت font-face@ در زبان سی اس اس

اگر خاصیت font-face@ را برابر با مقدار font-style قرار دهیم، یعنی می خواهیم استایل فونت سفارشی را تعریف نماییم.

مثال براساس مقدار font-style برای خاصیت font-face@

ویژگی font-face@ در css | تعریف فونت دلخواه سی اس اس

مقدار font-stretch درون خاصیت font-face@ در زبان سی اس اس

اگر خاصیت font-face@ را برابر با مقدار font-stretch قرار دهیم، یعنی می خواهیم میزان کشیدگی عرض فونت سفارشی را تعریف نماییم.

مثال براساس مقدار font-stretch برای خاصیت font-face@

مقدار font-weight درون خاصیت font-face@ در زبان سی اس اس

اگر خاصیت font-face@ را برابر با مقدار font-weight قرار دهیم، یعنی می خواهیم ضخامت فونت سفارشی را تعریف نماییم.

مثال براساس مقدار font-weight برای خاصیت font-face@

مقدار unicode-range درون خاصیت font-face@ در زبان سی اس اس

اگر خاصیت font-face@ را برابر مقدار unicode-range قرار دهیم، یعنی می خواهیم گستره یونیکد کاراکترهای فونت سفارشی را تعریف نماییم.

مثال براساس مقدار unicode-range برای خاصیت font-face@

مثال دستور کامل font-face@ در سی اس اس

ویژگی font-face@ در css | تعریف فونت دلخواه سی اس اس

ویژگی font-face@ در css | تعریف فونت دلخواه سی اس اس

بررسی خاصیت font-face@ از نظر نسخه زبان طراحی سی اس اس

خصوصیت font-face@ در سومین نسخه زبان طراحی css یعنی CSS3 معرفی شده است.

پشتیبانی مرورگرهای اینترنتی از فرمت های مختلف فونت مورد استفاده در خاصیت font-face@ درون زبان طراحی سی اس اس

پیوندهای مهم و کاربردی

تگ های HTML در سایت آموزی

تگ های جدید HTML5 در سایت آموزی

صفات تگ های HTML در سایت آموزی

تگ های منسوخ شده HTML5 در سایت آموزی

تگ های block level و inline level در سایت آموزی

تگ های HTML در W3school

ویژگی های CSS در سایت آموزی

ویژگی های CSS در W3schools

ویژگی font-face@ در css | تعریف فونت دلخواه سی اس اس

ویژگی font-face@ در css | تعریف فونت دلخواه سی اس اس – اختصاصی سایت آموزی