ویژگی font-synthesis-position در CSS یکی از ویژگی‌های جدید است که به ما این امکان را می‌دهد کنترل بیشتری بر روی موقعیت حروف مصنوعی درون فونت داشته باشیم. این ویژگی می‌تواند بیشتر در هنگامی که از فونت‌های سفارشی استفاده می‌کنید، مفید باشد.
این ویژگی به شما امکان می‌دهد که تعیین کنید وقتی کاراکتری در فونت‌های انتخابی شما موجود نیست، مرورگر باید چه نوع حروف مصنوعی را جایگزین کند. به طور کلی، این ویژگی می‌تواند وقتی موثر باشد که شما در حال طراحی رابط کاربری برای وب‌سایتی با فونت‌های خاص باشید.
در گذشته، حتی وقتی که حروف در یک فونت خاص موجود نبودند، مرورگر خودش حروف مصنوعی را برای این کاراکترها جایگزین می‌کرد که ممکن بود با ظاهر کلی فونت در تضاد باشد. اما حالا با استفاده از ویژگی font-synthesis-position شما می‌توانید مشخص کنید که این حروف مصنوعی باید چگونه در متن ظاهر شوند تا با سبک طراحی شما هماهنگ باشند.
از دیگر ویژگی‌های مهم این خصوصیت، امکان ایجاد تجربه کاربری قوی‌تر و هماهنگ‌تر در وب‌سایت‌هایی است که به طور گسترده از فونت‌های سفارشی بهره می‌برند. برای طراحان وب که به دنبال یکپارچگی طراحی در سرتاسر سایت خود هستند، این ویژگی می‌تواند کمک کننده باشد.
ساده‌ترین استفاده از ویژگی font-synthesis-position به شکل زیر است:
:root {
font-synthesis-position: normal;
}
در ادامه، به خط به خط این کد را توضیح می‌دهیم:
- :root :
شامل تمامی عناصر صفحه می‌شود و در این مثال، این استایل به همه اعمال می‌شود.
- font-synthesis-position: normal; :
این خط تعیین می‌کند که موقعیت حروف مصنوعی به صورت پیش‌فرض قرار گیرد و مرورگر تصمیم نخواهد گرفت تا در موقعیت‌های متفاوتی قرار دهد.