فونت awesome چیست؟ :: کافه کد - طراح قالب بلاگ بیان و وب

فونت awesome چیست؟

توسط حسین رجبی در شنبه, ۱۹ تیر ۱۳۹۵، ۰۴:۵۰ ب.ظ

فونت awesome چیست ؟

فونت 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 در وبگاه خود استفاده کنیم؟

 

  • برای استفاده کافیست در ساختار قالب خود کد زیر را در بین تگ <head> قرار دهید.

<link rel="stylesheet" href="آدرس فایل فونت awesome">
  • آدرس فایل  میتواند از cdn های آنلاین و پر سرعت باشد مانند:

<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;}
  • سپس میتوانید مانند مثال های بالا از آیکون های مورد علاقه خود استفاده کنید و لذت ببرید.

 کپی برداری با ذکر منبع مجاز است.

منبع : کافه کد 

(۱)

سجاد خلیلی

۲۴ آبان ۹۵، ۱۷:۴۷

  با سلام آیا می توانید یک اسکریپت تبادل لینک برای من بسازید تا در صفحه تبادل لینک وبلاگم به آدرس http://8learn.ir قرار بدم  

حسین رجبی

۱۰ آذر ۹۵، ۱۰:۳۰

  برای وبلاگ فقط میشه کاری کرد وبلاگ های ثبت شده به ایمیلتون فرستاده بشه و بقیه کارا با خودتونه!!! ولی میتونید از سرویس های رایگانی که توی اینترنت موجوده استفاده کنید.  

فرم ارسال نظر

ارسال نظر آزاد است، اما اگر قبلا در بیان ثبت نام کرده اید می توانید ابتدا وارد شوید.
شما میتوانید از این تگهای html استفاده کنید:
<b> یا <strong>، <em> یا <i>، <u>، <strike> یا <s>، <sup>، <sub>، <blockquote>، <code>، <pre>، <hr>، <br>، <p>، <a href="" title="">، <span style="">، <div align="">
تجدید کد امنیتی