Node.js 使用引导表单输入的有趣视觉错误

我正在使用引导表单。在表单组中，我有一些复选框。当我将鼠标悬停在第一个上时，它会按预期高亮显示第一个。当我将鼠标悬停在第二个按钮上时，它会突出显示第二个按钮和第一个按钮。当我将鼠标悬停在第三个按钮上时，它会突出显示第三个按钮和第一个按钮。等等我想知道这是否是一个已知的引导错误？我在express服务器上使用带帕格的nodeJS。她是我的密码：

.form-group.centerCheckboxes
    label Local Center Statistics
        .form-check
            label.form-check-label
                input#tutorRequestFrequency.form-check-input(type='checkbox' value='tutorRequestFrequency')
                |  Tutor request frequency
        .form-check
            label.form-check-label
                input#totalWorkingHours.form-check-input(type='checkbox' value='totalWorkingHours')
                |  Total working hours
        .form-check
            label.form-check-label
                input#totalHoursTutored.form-check-input(type='checkbox' value='totalHoursTutored')
                |  Total hours tutored
        .form-check
            label.form-check-label
                input#totalWeightPulled.form-check-input(type='checkbox' value='totalWeightPulled')
                |  Tutors "weight pulled" ratios

---

也许我使用引导类是错误的？这都在一个网格系统中，但我已经对网格进行了三次检查，以确保所有的数字行和列都被正确使用。有没有人听说过这个问题，或者知道它为什么会发生？

我发现了这个问题。这是因为我错误地使用了

标签

标签。当我将鼠标悬停在

.form组

中的任何内容上时，它也将鼠标悬停在

标签

上，该标签将自动应用于列表中的第一个复选框

为了解决这个问题，我没有使用

label

而是使用

div

，然后将原来在

标签中的文本放入
div
中