Rock Paper Scissors Lizard Spock
Are you in need of quick icons, check out Font Awesome!
The best thing about Font Awesome icons is:
- Vectors – clean, easy to resize, smooth edges
- Customizable – you can style them with simple CSS.
If you are using Elegant Theme’s Divi template here’s all you have to do.
- Paste code in Divi control panel Divi – Theme Options – Integration – ‘Add code to the <head> of your blog’ :
<linkrel="stylesheet"href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"/>. Or paste the code in your header.php file before the < / head > tag. - Font Awesome uses simple CSS class files to insert the icons
- All of the class files are located on their website – http://fontawesome.io/icons/
- To get the CSS class, locate the icon you want, click on the name, i.e. http://fontawesome.io/icon/hand-spock-o/. There you can get an example of how to insert the icon, for instance
class="fa fa-hand-spock-o"
- If you want to make the icon bigger simply add ‘fa-4x’ to your css after the class name: class=”fa fa-hand-spock-o fa-4x”. You can go as large as you need.
- For the final effect we styled our icons with a simple green :
.fa { color: #295133;
padding: 20px;
} - Never forget:
-
-
-
-
- Scissors cuts Paper
-
-
-
-
-
-
-
- Paper covers Rock
-
-
-
-
-
-
-
- Rock crushes Lizard
-
-
-
-
-
-
-
- Lizard poisons Spock
-
-
-
-
-
-
-
- Spock smashes Scissors
-
-
-
-
-
-
-
- Scissors decapitates Lizard
-
-
-
-
-
-
-
- Lizard eats Paper
-
-
-
-
-
-
-
- Paper disproves Spock
-
-
-
-
-
-
-
- Spock vaporizes Rock
-
-
-
-
-
-
-
- (and as it always has) Rock crushes Scissors
-
-
-
-
Peace Out!