📝 جلسه چهارم – واحدها و سایز فونت در CSS + فرمت فونت‌ها

1️⃣ واحدهای اندازه‌گیری در CSS

• px: پیکسل (واحد ثابت)
• %: درصد نسبت به عنصر والد
• rem: نسبت به font-size ریشه (html)
• em: نسبت به font-size والد
• vh / vw: درصد از ارتفاع/عرض ویوپورت
• vmin / vmax: درصد از کوچک‌ترین/بزرگ‌ترین ضلع ویوپورت

• cm, pt, inch: واحدهای چاپ

   

2️⃣ مثال‌های کاربردی اندازه فونت

html { font-size: 64px; }
.p-1 { font-size: 0.5rem; }   /* نیم واحد ریشه */
 .p-2 { font-size: 2rem; }     /* دو واحد ریشه */
  .p-3 { font-size: 0.5em; }    /* نصف فونت والد */ 
  div p { font-size: 1rem; }     /* اندازه نسبی به ریشه */ 

• نکته: rem نسبت به em، html نسبت به والد است.

4️⃣ انواع فرمت فونت‌ها و تبدیل آن‌ها

• فرمت‌های رایج فونت برای وب: TTF, OTF, WOFF, WOFF2, EOT, SVG
• انتخاب فرمت مناسب برای وب با توجه به سازگاری مرورگر و حجم فایل
• برای تبدیل فرمت فونت‌ها می‌توانید از سایت CloudConvert – Font Converter استفاده کنید.