Build Your Own CSS Microframework
Learn to build a CSS microframework.
Initially, we thought about adding a complete set of instructions on how to build each part of our micro framework in SCSS, including the steps to compile it. Instead, we are keeping it more beginner-friendly.
Before we begin building our CSS microframework, we’ll talk about the structure of what we’d like to build.
The structure of our CSS microframework
Here are the different sections that our CSS microframework needs to have:
- A CSS reset
- Simple layout classes
- Widths, heights, margins, and paddings
- Typography
- Effects (such as colors, shadows, or opacity)
- Column-grid
Why do we need a separate CSS structure?
A good CSS structure enables us to write efficient code. However, there is no such evidence that the above-mentioned code structure is the best for a CSS microframework.
Now, let's go into each of these sections in more detail.