آموزش طراحی سایت : افزودن فونت به سایت font web
110 بار بازدید -
8 ماه پیش
-
در ادامه دوره رایگان آموزش
در ادامه دوره رایگان آموزش HTML و CSS، با آموزش اضافه کردن فونت فارسی در CSS و HTML در خدمت شما همراهان گرامی هستیم، همان‌طور که می‌دانید تا زمانی که فونت‌های فارسی را به سند HTML و CSS و در واقع به وبسایت خودمان اضافه نکنیم، سایت ما از نظر ظاهری بسیار زشت خواهد بود، به همین دلیل تصمیم گرفتیم که آموزش فونت فارسی در CSS و افزودن فونت فارسی به سند HTML را در همین جلسات ابتدایی آموزش دهیم تا شما عزیزان بتوانید به سادگی هر نوع فونت دلخواه را به فایل html خود اضافه کنید.
فونت فارسی در css
باید دقت کنید که افزودن فونت به سند HTML توسط کدهای CSS انجام میشود، مراحل کار به این صورت است که ابتدا باید فونت ها را توسط font-face به سند CSS خود اضافه کنید و در مراحل بعدی از آن استفاده کنید.
نحوه استفاده از font-face
در CSS، خاصیت font-face یکی از روش‌هایی است که برای استفاده از فونت‌های سفارشی در وبسایت‌ها استفاده میشود. با استفاده از این خاصیت، می‌توانید فونت‌هایی را که در سیستم عامل کاربر نصب نشده‌اند را به صورت مستقیم در وبسایت خود استفاده کنید. به این ترتیب، قابلیت طراحی و استفاده از فونت‌های منحصر به فرد و جذاب در وبسایت شما فراهم میشود.
برای استفاده از font-face، ابتدا باید فایل فونت را در پروژه خود قرار داده و به آن ارجاع دهید. معمولاً فایل‌های فونت در فرمت‌هایی مانند TTF، OTF، WOFF یا WOFF2 موجود هستند. سپس می‌توانید در CSS خود، با استفاده از خاصیت font-face، این فونت را تعریف کنید و برای المان‌های مختلف وبسایت‌تان از آن استفاده کنید.
نحوه استفاده از font-face در CSS به صورت زیر است:
@font-face {
font-family: 'نام-فونت';
src: url('مسیر-فایل-فونت.woff2') format('woff2'),
url('مسیر-فایل-فونت.woff') format('woff');
/* سایر خاصیت‌های مورد نیاز مانند font-weight و font-style */
}
.selector {
font-family: 'نام-فونت', سایر-فونت‌ها, sans-serif;
}
مقدمه: 00:00
دانلود فونت مورد نظر:01:00
افزودن در فایل استایل:02:00
قرار دادن در بخش های مختلف:08:00
8 ماه پیش
در تاریخ 1402/10/29 منتشر شده
است.
110
بـار بازدید شده