Video Description
In this CSS3 Dropdown Menus training course, expert author Ben Jaffe teaches you how to build CSS dropdown menus, without using JavaScript! This course is designed for users that already have a fundamental understanding of CSS3.
You will start by learning the basics, including the new CSS3 properties and basic CSS transitions (animations), which will give your menus a professional quality. You will then learn how to build a simple menu with CSS3. Ben will teach you how to style the dropdowns and add the hover functionality. This video tutorial will also show you how to build a multi-level dropdown, teaching you how to style the other levels, add CSS3 transitions, and change the menu layout.
Once you have completed this computer based training course, you will be fully capable of creating your own CSS dropdown menus for your projects. Working files are included, allowing you to follow along with the author throughout the lessons.
Table of Contents
-
Introduction
- A Quick Introduction To CSS3 00:00:55
- What You Will Learn 00:01:04
-
The Basics
- CSS Hover 00:05:26
- New CSS Selectors 00:03:26
- Direct Child 00:08:23
- Creating Hover Tabs - Part 1 00:04:42
- Creating Hover Tabs - Part 2 00:05:28
- New CSS3 Properties - Part 1 00:02:09
- New CSS3 Properties - Part 2 00:03:37
- New CSS3 Properties - Part 3 00:06:38
- Basic CSS3 Transitions - Animations 00:07:52
-
Building A Simple Menu With CSS3
- The HTML Markup - Simple Menu 00:02:21
- Styling The Dropdown 00:03:33
- Adding The Hover Functionality 00:04:11
-
Building A Multi-Level Dropdown Menu
- The HTML Markup - Multi-Level Menu 00:05:25
- Styling The First Level With CSS3 - Part 1 00:04:41
- Styling The First Level With CSS3 - Part 2 00:05:37
- Styling The Other Levels 00:03:16
- When To Style Which Tag 00:06:52
- Adding CSS3 Transitions 00:05:28
- Changing The Menu Layout 00:04:32
-
Conclusion
- About The Author 00:01:16