bootstrap 开关按钮

Bootstrap 开关按钮是一种常用于界面设计的交互元素，可以用于控制某个状态的开关。在 Bootstrap 中，可以通过以下代码创建一个开关按钮：

<input type="checkbox" class="form-check-input" id="exampleCheck1">
<label class="form-check-label" for="exampleCheck1">Toggle switch</label>

其中，`type="checkbox"` 表示创建一个复选框，`class="form-check-input"` 表示将该复选框作为表单元素使用，`id="exampleCheck1"` 是该元素的 ID，`label` 标签则表示该开关按钮的文本。为了实现开关按钮的样式，还需要添加以下 CSS：

.form-check-label {
    padding-left: 0;
}
.form-check-input:checked + .form-check-label::before {
    transform: translateX(14px);
}
.form-check-input:focus + .form-check-label::before {
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

这段 CSS 中，`.form-check-label` 表示表单标签的样式，`.form-check-input:checked + .form-check-label::before` 表示选中状态下的开关按钮样式，`.form-check-input:focus + .form-check-label::before` 表示聚焦状态下的开关按钮样式。