html - 如何在选择时使 HTML 单选按钮加粗？

Question

在 HTML 中，我有以下单选按钮选项

o 选择 1
o 选择 2
o 选择 3

我想做的是当有人从上面选择一个单选按钮时，与所选单选按钮对应的文本变为粗体。

因此，例如 - 如果此人选择“选项 2”，则单选按钮选择现在将如下所示:

o 选择 1
o 选择 2
o 选择 3

我该怎么做？我假设必须使用 JavaScript 或 CSS。

提前致谢

更新:如果不使用 jQuery，您将如何实现“nickf”解决方案？

Answer 1

您可以纯粹使用 CSS 来完成此操作，但您需要将每个输入的文本包装在 span 或其他标记中:

<input type="radio" name="group1" value="Milk"><span>Milk</span><br>

然后只需使用兄弟选择器:

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