![]() |
VOOZH | about |
Bulma is a free, open-source CSS framework based on Flexbox. It is component-rich, compatible, and well documented. It is highly responsive in nature.
Radio buttons are mutually exclusive buttons, that is, you can select only one option in a radio button group. The Radio element is a simple wrapper around the radio input. Bulma doesn't style the radio buttons to ensure cross-browser compatibility. To make sure radio buttons are grouped together, they should have the same name attribute.
To disable a radio button, we can use the HTML disabled attribute on the input element as well as its label, and to check a radio button by default, the HTML checked attribute can be used on the input element.
Bulma Radio Class:
Syntax:
<label class="radio"> <input type="radio" name="gender"> Yes </label>
Example 1: The below example shows two simple radio buttons grouped together.
Output:
👁 Bulma RadioExample 2: The example below shows how to disable a radio button using the HTML disabled attribute.
Output:
Example 3: The example below shows how to check a radio button by default using the HTML checked attribute.
Output:
Reference: https://bulma.io/documentation/form/radio/