51吃瓜网

How to use FontAwesome

Font Awesome gives you scalable vector icons that can instantly be customized -- size, color, drop shadow, and anything that can be done with the power of CSS. You can add FontAwesome icons anywhere you have a text box in Moodle; these are the steps:

1. Browse the list of free FontAwesome icons here:


2.Once you pick the name of the FontAwesome icon that you want to use, e.g. fa-camera-retro聽 insert it in the HTML code area of the Moodle text box

3. Paste the name of the icon, surrounded by brackets wherever you want the icon at, e.g聽 [fa-camera-retro]

4. Additional effects that you can add to the icon are:
If you wish to make the icon larger you can use a multiplier. e.g.:
[fa-camera-retro fa-2x] or [fa-camera-retro fa-4x]
If you wish to rotate the icon you can specify how many degrees clockwise. e.g.:
[fa-camera-retro fa-rotate-90]
You can also flip an icon horizontally or vertically. e.g.:
[fa-camera-retro fa-flip-horizontal] or [fa-camera-retro fa-flip-vertical]
You can mute the colour to a dull grey. e.g.:
[fa-camera-retro fa-muted]
You can "pull" the icon to the left or right. If it is "pulled" to the left text will wrap to the right. e.g.:
[fa-camera-retro pull-left]

5. You can click on the link below for additional details regarding FontAwesome: