Icons are a great way of illustrating a layout. Although you can use libraries like font-awesome, sometimes it's better to be able to use your own icons. In this video, learn the necessary code to do that.
- [Instructor] After the last lab,…we're going to go back to something…a little bit simpler, just a regular…three-column layout, but I want to show you…how you can create your own custom icons.…So far, we have been using icons…from the Font Awesome library.…Occasionally, you want to use your own.…And, to do that, what you want…is generally something like an .svg file…that can be resized nicely, like this one.…Then, you want to create your own icon class.…I've already got this article right here…with an I.D. of page-iconcolumns,…it's a little bit tough to mention this.…
Already have the page-section class,…We'll just do a really simple three-column layout here.…We'll get started by creating the section tag here,…and this section tag is going to have…a class of layout-iconcolumns.…Because this is going to be a three-column layout,…I need to have some sort of container.…I'm also going to use the padding "y" class,…and put five units, which should be about three ems.…
Then grab all these subsections,…and paste them in here.…
Released
9/17/2018- Building a header and footer
- Adding styles to your project
- Making your navigation responsive
- Bootstrap layout components
- Using a multicolumn format
- Creating carousels
- Adding interactivity
- Creating animations
Share this video
Embed this video
Video: Creating an icon layout