استفاده از ابزارهای نو در طراحی سایت میتواند باعث سهولت در طراحی و جذابیت بیشتر سایت شما شود. یکی از این ابزارها میتواند فونت آیکون باشد.
یکی از فونت آیکونهای محبوب Font Awesome میباشد که در ادامه با برخی ویژگیها و نحوه استفاده آن آشنا خواهیم شد.
یک فونت، ۵۱۹ آیکون
در یک مجموعه واحد، Font Awesome یک زبان تصویری است که بسیاری از کنشهای وابسته به وب را شامل میشود.
بدون نیاز به جاوا اسکریپت
نگرانی کمتر بابت سازگار نبودن بدلیل آنکه نیاز به جاوا اسکریپت ندارد.
مقیاسپذیری بینهایت
آیکونها در هر اندازهای زیبا و جذاب خواهند بود.
قابلیت استفاده از CSS
به آسانی میتوانید به آیکونها رنگ، اندازه و هر انچه که با css امکانپذیر است بدهید.
نحوه استفاده
1- ابتدا آخرین ورژن فونت را از سایت Font Awesome دانلود کنید.
2- در <head> کد html خود آدرس زیر را قرار دهید.
کد:<link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">
3- Font Awesome طراحی شده است تا با عناصر درون خطی (inline element) مانند i و span استفاده شود. کافی است نام آیکون را پس از fa- در class بگذاریم.
برای مثال:
کد:<i class="fa fa-camera-retro"></i> fa-camera-retro
یا
کد:<i class="fa fa-desktop"></i> fa-desktop
منبع:
طراحی سایت فروشگاهی ستروکیتدر عکس زیر نمونه هایی از آیکونها را میتوانید مشاهده کنید.