定义 a:focus 选择器

Question

我有下面的 HTML 结构。

<html>
    <a class="customcssstyle" href="#'>Link</a>
</html>

现在我需要一个样式，这样在 link 上的 focus 上，它应该显示为红色。

对于正常的CSS，我们写成：

a.customcssstyle:focus
{
    color:red;
}

我可以知道我们如何使用 Less 来编写它 CSS。

Answer 1

CSS 语法在 less 中有效。但你也可以这样做：

.customcssstyle
{
    a {
        &:focus {
           color:red;
        }
    }
}

Answer 2

首先：a是行内元素，应该在块元素里面（不是html）。然后在 css 中调用 class 你需要一个点，例如.customcssstyle 而不是属性值 class 而已。至少要 select 该元素的焦点状态只需使用伪 select 或 :focus.

调用 class

.customcssstyle:focus {
  color: red;
}

Defining a:focus selector