html - 焦点上的样式跨度元素

Question

我遇到的问题是在 HTML 标记中对样式元素焦点进行硬编码。在 css 页面上它看起来像这样:

span.select.focus {
    background:rgba(189, 189, 189);
    border-right:solid 8px rgba(170, 194, 31, 0) !important;
}

我在哪里可以在没有焦点的情况下对元素进行硬样式设置

<span data-prefix="Shopping cart: " class="select profile" id="wordsPerQuiz" style="background-color: rgb (189,189,189)"> </span>

这是我的尝试。

  <span data-prefix="Shopping cart: " class="select profile" id="wordsPerQuiz" style="background-color: rgb (189,189,189)" focus="background-color: rgb (189,189,189)"> </span>

Answer 1

伪类 focus需要 :之前，不是. :

span.select:focus {
    background:rgb(189, 189, 189);
    border-right:solid 8px rgba(170, 194, 31, 0) !important;
}

带有 span.select.focus 的元素选择器是 <span class="select focus">在 HTML 中。