Bootstrap 3 Tutorial Pt.2 – Responsive Navbar with Dropdown Menus


https://i.ytimg.com/vi/m_xnqEgHnWM/hqdefault.jpg



Website: http://bootstrapbay.com
Source files: https://github.com/bootstrapbay/tutorials

In the second installment of our Bootstrap 3 tutorial, we build a responsive navbar with drop-down menus.

Navbars are responsive meta components that serve as navigation headers for your application or site. They begin collapsed (and are toggleable) in mobile views and become horizontal as the available viewport width increases.

Video highlights:

0:00 – Introduction
0:31 – We start building the structure for the navbar
1:41 – We explain the container class
2:45 – We build the button for the collapsible header
4:10 – We create the icon bars for the button
5:15 – We explain the brand class
6:00 – We start on the right hand side of the navbar
7:17 – We explain the active class
8:26 – We start building the drop-down menu
10:17 – We build the drop-down header
12:10 – The navbar is complete!
12:26 – Wrap-up

source

,

Leave a Reply