Now we have all the default styling for the navbar.įirst thing we’re going to do is build the button that we need for our responsive design. So you want to make sure you’re keeping everything within the container. In contrast, if you type some text before the container class, you’ll see the text shows up all the way to the left. So to illustrate that, if you type container here (within the container class), the text starts off here (within the grid). This keeps everything inside the Bootstrap grid that is needed for the responsive design. We’re going to go ahead and leave this as fixed. What that will do is, as you scroll down, the navbar won’t remain fixed at the top of the screen. If you want the navbar to remain fixed at the top of the screen as you scroll down, you would leave it fixed, or you can change this to static. You also have the option of fixed or static. There’s different options available, but we’re going to leave this as default. If we wanted to go black, we can go navbar-inverse and you’ll notice that it changes to black. It might even be hard to see, and we can actually change that. For the navbar-default, you’ll see that it’s kind of like a light grey colour. There’s different kinds of stylings available. If you haven’t already done so, make sure to check out our first video so you can follow along with us here.įirst thing I’m going to do is get rid of this h1 tag that we’re not going to need to build our navbar. In our first tutorial, we showed you guys how to install Bootstrap which is the source code that you’re looking at right now. Today we’re going to be building a responsive navbar with dropdown menus. Hey everybody this is Christopher Gimmer from, and welcome to the second installment of our Bootstrap 3 tutorial.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. Archives
December 2022
Categories |