html - 复选框不检查内部数据组件 =""

Question

我正在制作这个复选框列表并且一切正常，直到我将它放在这个 div 中并将 scss 包装在其中:

<div data-component="modal"></div>
[data-component='modal'] {styling goes here}

在 css 之外，它检查得很好。有人能告诉我这是怎么回事吗？

此外，它之所以称为模态，是因为此复选框位于模态内部。起初我以为模态把事情搞砸了，但效果很好。出于某种原因，问题出在 scss 中。

这是 codepen .

Answer 1

问题是你给了

背景:#fff;

在 .custom-checkbox .custom-control-indicator {

中

这就是不显示勾号的原因。

删除它并再次检查。