单击dt元素时的粗体文本（并保持这种方式直到再次单击）

Question

这是我今天提出的问题：

点击后，如何使HTML中的 dt 标记元素显示为粗体，并保持粗体，直到单击另一个 dt 元素和/或者下拉dt的部分是关闭的？

我正在使用符合Bootstrap 2.x / 3标准的css表，并试图找出如何执行此操作而无需修改我的硬代码或深入研究JavaScript（尽管这些是唯一可行的选项，我全是耳朵。

现在我的代码片段是这样的：

dt, .close { cursor:pointer; color:#093A7F !important; font-weight:normal; }
dt:active, dt:focus { font-weight:bold !important; }

同样，我们的想法是让问题保持粗体，直到相应的“答案”部分为止。已被关闭。目前，上述代码仅在文本被主动点击时加粗。

感谢任何帮助。

谢谢！ ：d

Answer 1

为元素添加tabindex属性：

<dl>
    <dt tabindex="1">title</dt>
    <dd>content</dd>
    <dt tabindex="2">title</dt>
    <dd>content</dd>
</dl>

http://jsfiddle.net/y9h8w/

Answer 2

可能有一个解决方案，您可以使用具有相同radio属性的name元素执行此操作。但样式并不是最简单的，我认为最后你必须使用Javascript。