- Introduction
- Create the Icons grid
- Icon animations Top section
- Bottom Icon animations
- Summary
Hi Guys!
WELCOME TO THE COURSE "14 Menu icon animations with CSS"
This course is divided in 5 Sections:
1. Introduction
2. Icons Grid
3. Top Icons
4. Bottom Icons
5. Summary
- You will be learning how to create the following Icons:
Hamburger, Veggie Hamburger, Hotdog, Blinds, Sandwich, Cross, Kebab, Candy box, and chocolate box.
Some of them will transition into an "X" others into arrows, minus symbol and others.
In this course you will be learning the following:
HTML
- Create a container, sections, boxes and the Icons lines adding the class to the tags with two words.
- Add Id's to the tags.
- Add the center tags.
- Add a title.
CSS
- Add style to the container, section and boxes and lines.
- Create a grid using the properties display, align-items, float and
justify content.
- Add 14 Icon boxes with a background color
- Add a gradient background when hover on the icon boxes.
- Use the property display to create the lines for the Icons.
- Create the animations when hover on the Icons using the properties transform and transition and the values rotate and translate.
- Add the style of an specific line using the property nth-child
- Add a time and transition style using the values cubic-Bezier
and the time in seconds.
-Use keyframes to add an animation to your Icons.
THIS COURSE IS AIM TO BEGINNERS & INTERMEDIATE PROGRAMMERS, WEB DESIGNER, WEB DEVELOPERS.
All the code is made under the html File including the Css Code.
NOT JAVASCRIPT IS USED IN THE COURSE.
A zip file is attached in the section "resources" on the last section of the course.
NEW 2023 CEH v11 | CEH v12 | 312-50 Real Exam Q/A 450 | 100% Passing Guarantee| Be Certified Ethical Hacker!
Overview of Digital Marketing. Get free 'SMstudy® Certified Digital Marketing Associate' Certification with this course.
Perfect Photoshop course for beginner web designers who want learn to how to make a clean simple web page design.
Learn the right way to setup & access your Amazon seller account, which selling strategies exist, how to add products
Hi Everyone!,
I have been actively engaged in the field of programming since 2019 and assumed the role of a Udemy Instructor in 2021. My commitment to education extends to platforms like YouTube, where I create comprehensive content aimed at making complex programming concepts accessible.
Should you have any inquiries or specific areas you'd like me to address, please don't hesitate to reach out.
Thank you for visiting, and I trust you will find the content both informative and enjoyable.