用户投稿ㄧ.Forms:核取方块与选项按钮(自定义)
<body data-spy="scroll" data-target="#nav-demo"> <div class="component" id="demo" style="height: 300vh"> <div class="custom-control custom-checkbox"> <input type="checkbox" class="custom-control-input" id="customCheck1"> <label class="custom-control-label" for="customCheck1"> A </label> </div> <div class="custom-control custom-radio"> <input type="radio" class="custom-control-input" name="radio" id="custom-radio1"> <label class="custom-control-label" for="custom-radio1"> A </label> </div> <div class="custom-control custom-radio"> <input type="radio" class="custom-control-input" name="radio" id="custom-radio2"> <label class="custom-control-label" for="custom-radio2"> B </label> </div> </div></body>.demo.component{ padding: 50px;}重点：
自定义的结构，父元素为.custom-control.custom-checkbox第二层为input.custom-control-input以及label.custom-control-label但是只有设定上面的不够，因为按钮不能按。所以要在input加一个id="customCheck1"以及label[for="customCheck1"]，之后就可按了radio选项按钮部分就要将id以及for改名称，以及在input添加name=".."才可单选codepen
参考：bootstrap4
微信扫一扫打赏
支付宝扫一扫打赏
