فونت ها در CSS



یکی دیگر از مواردی که در طراحی سایت به آن توجه می شود موضوعات مربوط به فونت ها می باشد. در دوره html یاد گرفتیم که چگونه از فونت های مختلف برای متون خود استفاده کنیم. اما مشکل این بود که ما فقط می توانستیم از فونت های پیش فرض استفاده کنیم. اما اکنون می خواهیم یاد بگیریم که چگونه فونت های سفارشی خود را به css اضافه کنیم و به متن های خود فونت های جذاب و سفارشی بدهیم. همچنین می توانیم سبک، اندازه و وزن فونت ها را تغییر دهیم. اما چگونه؟ فونت را تعیین کنید. ابتدا نحوه تعیین فونت مورد نظر را توضیح می دهیم. برای این کار ابتدا باید پوشه ای به نام fonts در پوشه اصلی مربوط به پروژه خود ایجاد کنیم. و سپس فونت هایی را که می خواهیم به سند خود اضافه کنیم در آن پوشه قرار دهید. و سپس از دستور زیر استفاده کنید: @font-face {font-family : ; Src: url(‘ font address ‘) ;} در این ساختار، همانطور که می بینید، برای مقدار font-family، نام فونتی را که قرار است استفاده کنیم، می نویسیم توجه داشته باشید که نوشتن آن ضروری نیست. نام اصلی فونت اما می توانیم هر نامی برای آن انتخاب کنیم اما باید دقت کنیم که در بقیه کارها از همین نام استفاده کنیم. اما در ادامه دستورات باید آدرس فونت را نسبت به فایل css بنویسیم. نحوه رسیدگی را در جلسات قبلی توضیح داده ایم. تا اینجا فونت مورد علاقه خود را به سند اضافه کرده ایم، حالا هرجا که بخواهیم از این فونت در سند خود استفاده کنیم کافی است از دستور font-family استفاده کنیم:””; از فونتی که در بالا اضافه کردیم استفاده کنید و نام آن را بنویسید. سبک فونت تغییر سبک فونت به این معنی است که حالت های مختلف معمولی و ایتالیک را به فونت خود می دهیم. برای این کار می توانیم از دستور زیر استفاده کنیم. سبک فونت: مورب; در این صورت فونت ما به صورت مورب نمایش داده می شود. یا کوچکترش کن font-size: می توانیم از یک عدد برای مقدار آن استفاده کنیم، مانند 20px. توجه داشته باشید زمانی که نیاز به استفاده از عنوان دارید، از افزایش اندازه فونت استفاده نکنید، زیرا افزایش اندازه فقط ظاهر متن را تغییر می دهد. تغییر می کند و مفهوم اهمیت متن را ایجاد نمی کند. در صورتی که تگ های عنوان علاوه بر بزرگنمایی ظاهر دارای معنا و مفهوم هستند. پس در استفاده از دستور font size دقت کنید. وزن فونت به چاق بودن آن بستگی دارد. با استفاده از دستور زیر می توانیم وزن فونت را تغییر دهیم: font-weight: 600; برای مقدار این دستور نیز می توانیم از یک عدد بدون واحد مانند 600 یا حروفی مانند پررنگ، روشن تر، معمولی و … استفاده کنیم.

دیدگاهتان را بنویسید