bootstrap复选框怎么实现-Tutorial Bootstrap-php.cn

bootstrap复选框怎么实现

(*-*)浩

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

asal

6534 orang telah melayarinya

复选框（Checkbox）

bootstrap复选框怎么实现

当创建表单时，如果您想让用户从列表中选择若干个选项时，请使用checkbox。（推荐学习：Bootstrap视频教程）

对一系列复选框使用 .checkbox-inline ，控制它们显示在同一行上。

复选框，可以设置

为父元素，类为 .custom-control 和 .custom-checkbox，复选框作为子元素放在该

里头，然后复选框设置为 type="checkbox"，类为 .custom-control-input。

复选框的文本使用 label 标签，标签使用 .custom-control-label 类，label 的 for 属性值需要匹配复选框的 id。

实例

<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>

Salin selepas log masuk

更多Bootstrap相关技术文章，请访问Bootstrap教程栏目进行学习！

Atas ialah kandungan terperinci bootstrap复选框怎么实现. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan：

bootstrap

sumber：php.cn

Artikel sebelumnya：bootstrap如何读 Artikel seterusnya：bootstrap字体颜色怎么改

Kenyataan Laman Web ini

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel terbaru oleh pengarang