css - 检查输入后文本的css选择器

Question

如果检查输入但我失败了，我正在尝试使输入后的文本变为粗体。我认为我没有找到文本。我感谢任何帮助或提示。

input[type="radio"]:checked+ {
  font-weight: bold;
}

<label for="radio-foobar">
  <input type="radio" id="radio-3" value="3" />
  Hello world!
</label>

标签： css

Answer 1

focus-within过渡技巧可以近似于此。过渡是为了确保即使您在外部单击也能保持样式。

label {
  font-weight: 400;
  transition:0s 999s;
}

label:focus-within {
  font-weight: 900;
  transition:0s;
}

<label for="radio-3">
  <input type="radio" id="radio-3" value="3" >
  Hello world!
</label>