Multiple：将目标样式条目合并为一个

Question

我想知道是否有任何方法可以使这个CSS更紧凑和通用

 #av:target, #bis:target, #ena:target, #esc:target, #kis:target, #kso:target... {
background:red;
}

基本上我有很多这样的风格，没有代码，如果我可以只有一个条目，因为他们都做同样的事情。

Answer 1

由于ID必须是唯一的，因此您的解决方案有两个：类名或属性。例子：

使用类

  <!-- HTML: -->
  <element class="target">

  <!-- CSS: -->
  .target:target { 
      /* your styles **/
  }

使用属性

  <!-- HTML: -->
  <element data-target=""> <!-- Can be empty or filled, but the important is the attribute -->

  <!-- CSS: -->
  [data-target]:target { 
      /* your styles **/
  }

通过此模式，您的CSS中有一条规则可以应用于您需要的所有元素。选择最符合您要求的那个。