Comment implémenter la case à cocher bootstrap-Tutoriel d'amorçage-php.cn

Comment implémenter la case à cocher bootstrap

(*-*)浩

Libérer： 2019-07-18 13:45:25

original

6438 Les gens l'ont consulté

Box

Comment implémenter la case à cocher bootstrap

Lors de la création d'un formulaire, utilisez la case à cocher si vous souhaitez que l'utilisateur sélectionne plusieurs options dans une liste. (Apprentissage recommandé : Tutoriel vidéo Bootstrap)

Utilisez .checkbox-inline pour une série de cases à cocher afin de contrôler leur affichage sur la même ligne.

Case à cocher, vous pouvez définir

comme élément parent, la classe est .custom-control et .custom-checkbox, la case à cocher est placée à l'intérieur du

element, Ensuite, la case à cocher est définie sur type="checkbox" avec la classe .custom-control-input.

Le texte de la case à cocher utilise l'étiquette label, et l'étiquette utilise la classe .custom-control-label. La valeur de l'attribut for de l'étiquette doit correspondre à l'identifiant de la vérification. boîte.

Exemple

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

Copier après la connexion

Pour plus d'articles techniques liés à Bootstrap, veuillez visiter la colonne Tutoriel Bootstrap pour apprendre !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées：

bootstrap

source：php.cn

Article précédent：Comment prononcer bootstrap Article suivant：Comment changer la couleur de la police bootstrap

Déclaration de ce site Web

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Derniers articles par auteur