YoVDO

Learn CSS

Offered By: YouTube

Tags

HTML & CSS Courses Computer Science Courses Javascript Courses Web Design Courses User Interface Design Courses Responsive Design Courses

Course Description

Overview

Explore a comprehensive series of CSS tutorials covering a wide range of topics, from creating visually appealing components to implementing beautiful animations and effects. Dive into practical projects like building a custom progress bar, implementing a light/dark theme toggle, crafting a Netflix-style mobile navigation, and designing a responsive animated navigation bar. Learn essential CSS techniques such as smooth scrolling, custom checkboxes, and image reflection effects. Develop interactive elements using JavaScript, including a traffic lights simulator, random picker visualizer, and PokeDex. Create engaging animations like kinetic loaders, rotating circles, and wave effects. Practice responsive design principles by building a newsletter and exploring full-page backgrounds. Challenge yourself with a coding project to convert 10 website designs into HTML and CSS implementations.

Syllabus

Line Through Effect - CSS and JavaScript - Day 05.
Custom Progress Bar with CSS and JavaScript - Day 02.
Light/Dark Theme Toggle with CSS and JavaScript.
Jumping Loading Animation with CSS.
CSS3 Pulse Effect.
Netflix Mobile Navigation Animation with CSS and JavaScript.
CSS Smooth Scroll - Only one line - Day 14.
Traffic Lights Simulator with CSS and JavaScript - Day 09.
JavaScript Random Picker Visualizer & 1000 Subs Giveaway .
CSS Custom Checkbox - Day 08.
Image Reflection - CSS effect - Day 10.
Mix Blend Loader - CSS Tutorial - Day 12.
Waves Animation with JavaScript - Day 18.
PokeDex - JavaScript Tutorial - Day 19.
Kinetic Loader Animation with CSS - Day 24.
HTML and CSS Newsletter Design - Day 25.
Setting Goals For 2020.
Rotating Circles Animation - Day 26.
Wave Animation on inputs - CSS and JavaScript Tutorial - Day 27.
CSS Triangle Shape - Day 28.
Zoom Effect - CSS and JavaScript tutorial - Day 30.
Animated Sidebar Menu - CSS and JavaScript tutorial - Day 31.
Responsive Navigation with Hamburger Menu - CSS And JavaScript Tutorial.
I "Hacked" YouTube's Homepage with a Chrome Extension .
Create a Modal (Popup) with HTML/CSS and JavaScript.
Responsive Animated Navigation Bar | HTML, CSS and JavaScript Tutorial.
CSS Only Heart Shape | CSS Beginner Tutorial.
CSS Only Heart Shape | CSS Beginner Tutorial.
Heart Pulse Effect | CSS Animation Tutorial.
Heart Pulse Effect | CSS Animation Tutorial.
Donate Card | Design to CSS Project.
Full Page Background | Simple CSS Tutorial.
Building 10 Websites - From Design to HTML and CSS - Coding Challenge .


Taught by

Florin Pop

Related Courses

Probabilistic Graphical Models 1: Representation
Stanford University via Coursera Computer Security
Stanford University via Coursera Intro to Computer Science
University of Virginia via Udacity Introduction to Logic
Stanford University via Coursera Internet History, Technology, and Security
University of Michigan via Coursera