فونت awesome ابزاری بسیار جالب و کارآمد برای قالب نویسان طراحان و وبلاگ نویسان است که به شما این امکان را میدهد که بدون نیاز به استفاده از عکس بتوانید از آیکون ها و وکتور های مختلف و کاربردی در وبگاه و طراحی های خود استفاده کنید.
از دیگر ویژگی های این ابزار این است که شما میتوانید با استفاده از css و html رنگ،اندازه،سایه ها، و سایر ویژگی های آن را مشخص کنید و برای استفاده از آن نیاز به جاوا اسکریپت نیست.
نمونه کاراکتر ها:
<i class="fa fa-volume-control-phone" aria-hidden="true" style="color:green;"></i>
<i class="fa fa-star" aria-hidden="true" style="color:#ja2a239;"></i>
Loading...
<i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
<span class="sr-only">Loading...</span>
علامت ممنوع بر روی رو دوربین
<span class="fa-stack fa-lg">
<i class="fa fa-camera fa-stack-1x"></i>
<i class="fa fa-ban fa-stack-2x text-danger"></i>
</span>
مشاهده لیست کامل آیکون ها و وکتور ها در سایت اصلی
چگونه از فونت awesome در وبگاه خود استفاده کنیم؟
<link rel="stylesheet" href="آدرس فایل فونت awesome">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
*یا اینکه خود فایل اصلی آن را دانلود کرده و در محل دلخواه قرار دهید و آدرس آن را داخل ویژگی href=" " قرار دهید. دانلود فایل اصلی
-
و کد زیر را در قسمت استایل css خود قرار دهید یا در بین تگ <head> تگی به اسم تگ <style> ایجاد کرده و کد زیر را در بین آن قرار دهید.
i{font-family:'FontAwesome';font-weight:normal;
font-style:normal;}
سپس میتوانید مانند مثال های بالا از آیکون های مورد علاقه خود استفاده کنید و لذت ببرید.
کپی برداری با ذکر منبع مجاز است.
منبع : کافه کد