Tailwind CSS Basics

Cascading Style Sheets (CSS) can be hard to maintain, especially when you need to think about naming semantic classes or making changes in your CSS that can break something within your entire code. Tailwind CSS is an efficient and well-designed solution for these problems.

Tailwind CSS is a CSS framework to build web pages quickly, without worrying about naming classes through writing pre-styled classes directly in HTML. These classes are called utility classes and are the core feature of the Tailwinds workflow, which allows you to build custom designs quickly. In other words, Tailwind does not style the HTML elements as a whole. The utility classes are like building blocks to design the elements property by property, without naming its classes and making changes safely.

Previously, you learnt CSS properties to build layouts and style elements. In this campaign, you will learn how to use these properties through Tailwind CSS, as well as how to install Tailwind correctly and how it works. By the end of this campaign, you will be tasked to build a Feature Section Component using everything you learn.

Note: To have a higher chance of success in completing this module, you are strongly advised to have a good understanding of CSS. If you do not, why not try out StackUp Learn's CSS Skill Path first?