Tailwind CSS 3 Essential Training

Focused View

Ray Villalobos

2:27:45

361 View

01 - Introduction

01 - Why utility-first frameworks matter.mp4

00:53

02 - Using the exercises for this course.mp4

02:11

02 - 2. Getting Started

01 - Working with Tailwind CSS.mp4

03:38

02 - Creating a custom build.mp4

08:37

03 - Tailwind Play.mp4

01:59

04 - Examples with CodePen.mp4

03:19

05 - CodeSwing playground.mp4

02:48

03 - 3. Utility-First Features

01 - Preflight.mp4

06:25

02 - Utility class structure.mp4

12:10

03 - Tailwind pitfalls.mp4

11:01

04 - Color classes.mp4

06:40

05 - Shortcut classes.mp4

04:35

06 - Special classes.mp4

03:05

07 - Responsive design.mp4

03:32

08 - Custom properties.mp4

03:52

09 - Challenge Create a layout.mp4

02:05

10 - Solution Create a layout.mp4

03:49

04 - 4. Power Techniques

01 - State modifiers.mp4

09:49

02 - Position modifiers.mp4

05:26

03 - Child and sibling elements.mp4

08:15

04 - Form modifiers.mp4

04:11

05 - Attribute modifiers.mp4

03:56

06 - Pseudo-elements.mp4

01:41

07 - Media modifiers.mp4

02:42

08 - Dark mode.mp4

02:37

09 - Challenge Dark mode and grouping.mp4

01:54

10 - Solution Dark mode and grouping.mp4

04:18

05 - 5. Customizing Tailwind

01 - Exploring the config.mp4

02:16

02 - Configuring themes.mp4

03:45

03 - Existing scales.mp4

02:11

06 - 6. Plugins

01 - Plugins.mp4

02:05

02 - Typography.mp4

06:00

03 - Line clamp.mp4

03:39

07 - Conclusion

01 - Next steps.mp4

02:21

Description

While the ways in which we work on the web evolve over time, every now and then, a true game changer comes along. The utility-first approach of Tailwind 3 throws out many of the traditional approaches to building projects on the web, allowing you to create a complete and unique website without writing a single line of CSS. In this course, LinkedIn senior staff instructor Ray Villalobos shows how Tailwind CSS 3 offers a lightweight but sophisticated framework for styling content on your sites and apps through labeling with appropriate class names.

Discover utility-first features with techniques vetted by a Tailwind power user. Find out how to modify, customize, and manage content as you build the layout of your pages, adding Tailwind and specifying its use on the HTML elements of each page. Along the way, get tips from Ray on leveraging Tailwind plugins to control your text, classes, designs, line clamp, and typography according to specs.

This course is integrated with GitHub Codespaces, an instant cloud developer environment that offers all the functionality of your favorite IDE without the need for any local machine setup. With Codespaces, you can get hands-on practice from any machine, at any time—all while using a tool that you’ll likely encounter in the workplace. Check out the “Using GitHub Codespaces with this course” video to learn how to get started.

More details

User Reviews

Rating

average 0

Total votes0

Focused display

tailwind css

Ray Villalobos

Instructor's Courses

I published more than 100 courses focused on front-end development topics like JavaScript, Node.js, Vue.js, React, and Sass, plus frameworks like Bootstrap. My goal is to help people understand complex subject through real-world exercises and projects. Look for me @planetoftheweb or through my blog at http://raybo.org.

Linkedin Learning

View courses Linkedin Learning

LinkedIn Learning is an American online learning provider. It provides video courses taught by industry experts in software, creative, and business skills. It is a subsidiary of LinkedIn. All the courses on LinkedIn fall into four categories: Business, Creative, Technology and Certifications. It was founded in 1995 by Lynda Weinman as Lynda.com before being acquired by LinkedIn in 2015. Microsoft acquired LinkedIn in December 2016.