Bulma Modifiers Syntax
Modifiers in Bulma are used to manipulate a particular class in order to get the desired output. To implement the modifiers, one has to either use the is- or the has- modifier class before the modifier name. It is essential to know the syntax of these modifiers in order to implement them in our code.
<div class = "is-modifier-name" ... </div> or <div class = "has-modifier-name" ... </div>
- is-modifier-name: This modifier-name takes various values like is-primary, is-link, is-info, is-success, is-warning, is-danger, etc.
- has-modifier-name: This modifier-name takes various values like has-primary, has-link, has-info, has-success, has-warning, has-danger, etc.
Let us dive deep into this topic, by having a look at a practical example of modifiers.
Example 1: In the below example, we have used color modifiers in order to make the columns colorful and give a background color.
Example 2: Let us now look at another example, in which we will be creating buttons and use size modifiers in order to have buttons of different sizes.
Reference Link: https://bulma.io/documentation/overview/modifiers/