Join Chris Converse for an in-depth discussion in this video Using the exercise files, part of Design the Web: Creating CSS-Only Navigation Menus.
- View Offline
- The exercise files for this course are available to all members, and when you download the files there's going to be a folder called Ch_01 for Chapter One. Inside there, there's a folder called 01_01. Inside there, there's an Assets directory and an HTML file. Now inside of the Assets directory there are two web graphics, a banner.jpg graphic which I'm using as the background to the header area of the page, and I'm also using a logo.png file. Now there's also a menu.css file in here which is used to create the basic layout and style for the web page.
There's also a media query in here for medium-sized screens. We'll be adding additional CSS rules into this file in order to transform the bullet list into our menu. And next to the Assets directory is an HTML file. This contains all of the necessary markup for our basic page, and in conjunction with that media query we can see that this also sizes down to a medium size screen as well. And at the top of the page we can see the bulleted list that we're going to extend and conform into a menu. And now that we're familiar with the exercise files, we're going to create our menu structure by adding nested bulleted lists into the bulleted list that we have already.
The exercise files are free to all members! Download them today to start creating your own multilevel dropdown menus.