20 Aug 2019
The introduction and features of Bulma CSS framework
What is Bulma?
Bulma is a free, open-source CSS framework based on Flexbox and used by more than 200,000 developers.
The main advantage of using Bulma is that its box model is fully based on Flexbox. no more CSS floats and percentages. CSS framework made easy to create UI design components and patterns.
Responsiveness – 100% Responsive.Design for a mobile-first
Every element in Bulma is mobile-first and optimizes for vertical reading, so by default on mobile:
- columns are stacked vertically
- the level component will show its children stacked vertically
- the nav menu will be hidden
You can, however, enforce the horizontal layout for both columns or level by appending the is-mobile modifier.
Modularity – Just import what you need
Bulma consists of 39 .sass files that you can import individually.
For example, let’s say you only want the Bulma columns.
The file is located in the bulma/sass/grid folder.
Simply import the utilities dependencies, and then the files you need directly:
Morden- Columns powered by Flexbox.A simple way to build responsive columns.
Building a columns layout with Bulma is very simple:
- Add a columns container
- Add as many column elements as you want
Each column will have equal width, no matter the number of columns.
Free – Open Source on GitHub
Why to use Bulma?