• Post category:StudyBullet-4
  • Reading time:11 mins read




Learn Complete CSS from basics to Grid, Flex, Sass, Shapes, Pseudo Elements, Hover Effects, Character Animations & more

What you will learn

 

Learn CSS from Scratch to Advanced Level

 

Learn CSS Grid, CSS Flex, SASS

 

Learn working with CSS Shapes , CSS Gradients , CSS Pseudo Elements

 

Learn CSS Transition and Animation

 

Learn Creating Awesome Projects in CSS

 

Learn Creating Awesome Unique Hover Effects

 

Learn Creating Awesome Loader Animations

 

Learn Creating Character Animations

Description

Do you want to Learn CSS from Scratch ?

Do you want to become a Master in CSS ?

Are you searching for a 1 stop course to Learn CSS from scratch to Advanced Level ?

Do you want to learn CSS, Flex, Sass, Grid ?

Do you want to Learn Creating Awesome Hover Effects , Unique Loader Animations ?

Do you want to Learn working with Pseudo Elements ?

Do you want to Play in CSS by creating different kind of shapes in CSS ?


Get Instant Notification of New Courses on our Telegram channel.


If your answer to any of the above questions is ‘YES’, then this course is for you

Welcome to this Mega Course : All in 1 CSS Course

This course covers all the following core topics in CSS :

  • Starting from CSS basics to

  • CSS Grid

  • CSS Flex

  • SASS

  • CSS Shapes

  • CSS Gradients

  • CSS Pseudo Elements

  • Creating Awesome Unique Hover Effects

  • Transitions & Animations

  • Creating an Awesome Hero Area with Shape Divider

  • Creating Button Hover Effects

  • 10 Hover Effect Projects

  • 10 Loader Animation Projects

  • 5 Character Animation Projects

  • Over 40+ Real Projects

    And More

So , in this Course, you are not only Learning CSS, but also implementing your knowledge with Projects.

Everything is explained in detailed fashion.

All the resource files are attached at the Resources Section

Also if you have any issue understanding some concept, feel free to let me know via Q/A section or you can even message me.

This Course comes with 30 Days Money back guarantee. If you dont like the course after you enrolled , you will get 100% refund with no questions asked. But believe me , you will enjoy the course and also you will learn many tips , tricks in CSS .

So, Are you ready to become master in CSS ? Enroll Now and take your First Step. I am looking forward to see you inside.

 

 

English
language

Content

Introduction

Introduction

CSS Crash Course

CSS Syntax
CSS Selectors
Understanding CSS Parent Selectors
CSS types of Styles
Colors
CSS border, border-radius and outline
CSS Margin
CSS Padding
Understanding the concept of BOX Model
CSS Font Family
CSS Width and Height
Text Formatting
CSS Display
CSS Positioning (Important)
Concept of CSS Overflow
Concept of Float and Clear
CSS Opacity
Box Shadow
Text Shadow

CSS Transition and Animation

Transition Property and Transition Duration
Transition Timing Function and Tranition Delay
Interesting Illustration with Transition Delay
Project : Cool Unique Hover Effect
Animation Basics : Part1
Animation Basics : Part2
Animation Shorthand
Project : Animatied Video Background Hero Area Part1
Project : Animatied Video Background Hero Area Part2
Project : Animatied Video Background Hero Area Part3

CSS Grid Crash Course

Concept of Grid Template, Grid-gap, Grid-auto-X
Concept of Grid auto flow
Concept of Different Grid Gap
Justify Content
Difference between Justify Content and Justify Items
Align Content and Align Items
Place Content
Rearranging Items using some cool properties
Grid Area and Challenge
Solution for the Challenge
Justify Self and Align Self
Project – Web Layout using CSS Grid easily

CSS Flex Crash Course

Display Property
Flex Direction
Flex Wrap
Flex Flow
Justify Content
Align Items
Align Content
Order
Flex Grow
Flex Shrink
Flex Basis
Flex Shorthand
Align Self

CSS Sass Crash Course

Intro
Sass Variables
Sass Nesting
The Ampersand Sign (&)
Shortening code having same prefix
Mixin
Mixin Challenge
Import
Extend
Mixin with arguments
Final Touch of The Project

CSS Pseudo Element

Understanding Pseudo Element and Project : Unique Hover Effect1
Project : Unique Hover Effect2
Project : Unique Hover Effect3
Project : Unique Hover Effect4

CSS Shapes

Triangle
Hexagon
Circle
Book Shape
Final Hero Area Project

Ultimate Hover Effect Project

Creating HTML Markup
Font Awesome CDN Link
Styling our Project
Hover Effect – Adding Memphis
Zooming, Bouncing and Rotation Effects
Final Touch

10 Awesome Hover Effects Projects

Basic Markup to start with
Using Font Awesome
Basic Styles
Hover Project1
Hover Project2
Hover Project3
Challenge for You
Hover Project4
Hover Project5
Hover Project6
Hover Project7
Hover Project8
Hover Project9
Hover Project10

10 Unique Loader Animations Projects

Basic Markup to start with
Project1
Project2
Project3
Project4
Project5
Project6
Project7
Project8
Project9
Project10
Implementation of full page and constrained dimension of Animated loaders

5 Character Animations Projects

Simple but Important Information to start with
Project : Running Santa
Project : Walking Dino
Fun Project : Dino Chasing Santa
Project : unique concept bahamut
Project : Dark Knight

Resources Section

Download Resource files