How to implement bootstrap checkbox-Bootstrap Tutorial-php.cn

How to implement bootstrap checkbox

(*-*)浩

Release： 2019-07-18 13:45:25

Original

6606 people have browsed it

Checkbox

How to implement bootstrap checkbox

When creating a form, use checkbox if you want the user to select several options from a list. (Recommended learning: Bootstrap video tutorial)

Use .checkbox-inline for a series of checkboxes to control them to be displayed on the same line.

Check box, you can set

as the parent element, the class is .custom-control and .custom-checkbox, the checkbox is placed as a child element inside the

, Then the checkbox is set to type="checkbox" with class .custom-control-input.

The text of the check box uses the label label, and the label uses the .custom-control-label class. The value of the for attribute of the label needs to match the id of the check box.

Example

<div class="checkbox">
    <label><input type="checkbox" value="">选项 1</label>
</div>
<div class="checkbox">
    <label><input type="checkbox" value="">选项 2</label>
</div>    
#内联
<div>
    <label class="checkbox-inline">
        <input type="checkbox" id="inlineCheckbox1" value="option1"> 选项 1    </label>
    <label class="checkbox-inline">
        <input type="checkbox" id="inlineCheckbox2" value="option2"> 选项 2    </label>
    <label class="checkbox-inline">
        <input type="checkbox" id="inlineCheckbox3" value="option3"> 选项 3    </label>
</div>

Copy after login

For more technical articles related to Bootstrap, please visit the Bootstrap Tutorial column to learn!

The above is the detailed content of How to implement bootstrap checkbox. For more information, please follow other related articles on the PHP Chinese website!

Related labels：

bootstrap

source：php.cn

Previous article：How to pronounce bootstrap Next article：How to change bootstrap font color

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn