DEV Community

Cover image for Day 2: Finished Bootstrap!
Kemystra
Kemystra

Posted on

Day 2: Finished Bootstrap!

The Feynman technique says that teaching a subject makes you better at it, which is what I'm trying to do here. You may correct me if you saw mistakes in this post

Font Awesome 🍰

Font Awesome is a library of icons that can be accessed with this CDN link:

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
Enter fullscreen mode Exit fullscreen mode

As implied, this thing is lit 🔥! You don't need to numerous icons as SVGs in your site, just reference them in Font Awesome.

To insert the icons, use either i or span tag, with a specific class (just like Bootstrap!):

<i class="fas fa-thumbs-up"></i>
<!-- This will show a thumbs up icon -->
Enter fullscreen mode Exit fullscreen mode

fa is just short of Font Awesome. The fas (or fa) class is a must.

Other Bootstrap classes

  • form-control
    This gives form elements 100% width.

  • well
    It gives a sense of depth, although I haven't actually seen it 👀.

Afterword

There's not much anything new that I learnt today, mostly revising what I have known. FreeCodeCamp is preparing me for jQuery next, which would be the topic tomorrow.

Anyway, I finished Bootstrap today, so that's an achievement 🥳. See you guys tomorrow!

Follow me on Github!
Also on Twitter!

Discussion (0)