การใช้ "fa-spin" เพื่อทำให้ไอคอนหมุนได้และ การใช้ "fa-pulse" ทำให้ไอคอนหมุน 8 ขั้น
<i class="fa fa-spinner fa-spin"></i>
<i class="fa fa-circle-o-notch fa-spin"></i>
<i class="fa fa-refresh fa-spin"></i>
<i class="fa fa-cog fa-spin"></i>
<i class="fa fa-spinner fa-pulse"></i>
การใช้ "fa-rotate-ขนาดองศาที่จะหมุน"และ การใช้ "fa-flip-ขนาดองศาที่จะหมุน"เพื่อให้ไอคอนหมุนหรือพลิกตามที่เราต้องการ
<i class="fa fa-car fa-5x"></i>
<i class="fa fa-car fa-5x fa-rotate-90"></i>
<i class="fa fa-car fa-5x fa-rotate-180"></i>
<i class="fa fa-car fa-5x fa-rotate-270"></i>
<i class="fa fa-car fa-5x fa-flip-horizontal"></i>
<i class="fa fa-car fa-5x fa-flip-vertical"></i>
ใช้เพื่อกองรวมหลายไอคอน โดยใช้ "fa-stack" บน parent โดยมี "fa-stack-1x" เป็นขนาดปกติของไอคอน ถ้าจะเพิ่มขนาดของไอคอนสามารถทำได้โดยการเพิ่มจำนวนตัวคูณ เช่น "fa-stack-2x" เป็นขนาดที่ใหญ่กว่า
<span class="fa-stack fa-lg">
<i class="fa fa-circle-thin fa-stack-2x"></i>
<i class="fa fa-twitter fa-stack-1x"></i>
</span>
fa-twitter on fa-circle-thin<br>
<span class="fa-stack fa-lg">
<i class="fa fa-circle fa-stack-2x"></i>
<i class="fa fa-twitter fa-stack-1x fa-inverse"></i>
</span>
fa-twitter (inverse) on fa-circle<br>
<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" style="color:red;"></i>
</span>
fa-ban on fa-camera
fa-twitter on fa-circle-thin| อ้างอิงเว็บไซต์ฝึกเพิ่มเติม | |
|---|---|
| Font Awesome Intro | |