Gain insights into industry best practices for designing web pages with Tailwind CSS. Explore typography, box models, and master layouts using flexbox and grids effectively.

docker.tar.gz

QS_Tailwind

Apply_tailwind

This course examines and explains industry best practices to design web pages using Tailwind CSS. We’ll start with the typography of individual elements, and then we’ll get to “the box”—the rectangle of space each element takes up on a web page and how to manipulate it. Once we have our elements in boxes, we’ll take a look at the page layout using flexbox and grids.

Modern CSS with Tailwind

Which class is used to rotate an element?


Which class is used to rotate an element?

Which class is used to place all properties under the transition banner?

Which class is used to place all properties under the transition banner?

Which class will change the button color to yellow when a user hovers over a button?


Which class will change the button color to yellow when a user hovers over a button?

Which class is used to change the scale of an element?


Which class is used to change the scale of an element?

Introduction

Getting Started with Tailwind

Tailwind Basics

Typography

The Box

Page Layout

Animation

Responsive Design

Customizing Tailwind

Build an Interactive E-Library Using Next.js and Tailwind

Conclusion

Appendix

Quiz Yourself on Animation