Learn everything you need to know about Tailwind CSS
What you'll learn
Tailwind CSS installation with CLI
Tailwind CSS Flex
Tailwind CSS Grid
Tailwind CSS Animation
How to use Tailwind CSS Documentation
How to create website from scratch using Tailwind CSS
Deploying Tailwind CSS to Github
Hosting Tailwind CSS Project on Netlify, Vercel, cPanel
Requirements
Basic knowledge of HTML and CSS
Description
Tailwind CSS is used to style websites in the fastest and easiest way.Tailwind CSS is basically an utility-first CSS framework for rapidly building custom user interfaces. It is a highly customizable, low-level CSS framework that gives you all of the building blocks you need to build bespoke designs without any annoying opinionated styles you have to fight to override.The beauty of this thing called tailwind is it doesn't impose design specifications or how your site should look, you simply bring tiny components together to construct a user interface that is unique. What Tailwind simply does is take a 'raw' CSS file, process this CSS file over a configuration file, and produces an output.Why Tailwind CSS?Faster UI building processIt is na utility-first CSS framework which means we can use utility classes to build custom designs without writing CSS as in the traditional approach.Advantages of Tailwind CSS:No more silly names for CSS classes and Id's.Minimum lines of Code in CSS file.You can customize the designs to make the components.Makes the website responsive.Makes the changes in the desired manner. CSS is global in nature and if make changes in the file the property is changed in all the HTML files linked to it. But with the help of Tailwind CSS we can use utility classes and make local changes.
Overview
Section 1: Introduction
Lecture 1 Setting Working Environment
Section 2: Utility First
Lecture 2 Utility First
Section 3: Text and Colors
Lecture 3 Text and Colors
Section 4: Padding, Margin and Space
Lecture 4 Padding, Margin and Space
Section 5: Font and Typography
Lecture 5 Font and Typography
Section 6: Text and Decoration
Lecture 6 Text and Decoration
Section 7: Height and Width
Lecture 7 Height and Width
Section 8: CSS Position
Lecture 8 CSS Postion
Section 9: Background Image and Shadow
Lecture 9 Background Image and Shadow
Section 10: Border and Outline
Lecture 10 Border and Outline
Section 11: Break Point and Media Query
Lecture 11 Break Point and Media Query
Section 12: Hover and Interactivity
Lecture 12 Hover and Interactivity
Section 13: Transition and Transform
Lecture 13 Transition and Transform
Section 14: Flexbox Property
Lecture 14 Flexbox Property
Section 15: Working with CSS Grid
Lecture 15 Working with CSS Grid
Section 16: Tailwind CLI Setup with VS Code
Lecture 16 Tailwind CLI Setup with VS Code
Section 17: Customizing Tailwind CSS / Functions and Derivatives
Lecture 17 Customizing Tailwind CSS / Functions and Derivatives
Section 18: Hero section with Flex
Lecture 18 Hero Section with Flex
Section 19: Single Product Page
Lecture 19 Single Product Page
Section 20: Featured Post Layout
Lecture 20 Featured Post Layout
Section 21: Featured Products
Lecture 21 Featured Products
Section 22: Featured Product Categories
Lecture 22 Featured Product Categories
Section 23: Building website from scratch using Tailwind CSS
Lecture 23 Building website from scratch using Tailwind CSS
Section 24: Deploy Tailwind CSS project to cPanel, GitHub, Netlify, Vercel
Lecture 24 Deploy Tailwind CSS project to cPanel, GitHub, Netlify, Vercel
Web Developer,Web Designer,Software Engineer,Freelancer Developer on Upwork/Fiverr,Full Stack Developer,People who want to learn how to develop website