html - 如何转换这个标签限定的选择器？

Question

对于一个新元素，我的任务是将所有内联 CSS 提取到它自己的文件中。虽然我已经弄清楚了很多这样的 HTML/CSS 恶作剧，但这个让我感到困惑:

<table class="border">
  <tr>
    <td>Logical</td>
    <td>Arbitrary</td>
    <td class="param_indent">Name of Ghostbuster. One of the following:<br>
      VENKMAN<br>
      STANTZ<br>
      SPENGLER<br>
      ZEDDEMORE
    </td>
  </tr>
</table>

每个 其他条目都使用格式“<.class>”，但是我能让它工作的唯一方法如下:

  td.param_indent {
    text-indent:-28px;
    padding-left:30px;  
 }

在不更改行中其余单元格的情况下，我可以格式化此 more efficiently? 吗？

以下是“.border”的条目:

.border table, .border td, .border tr, .border th {
  border: 1px solid black;  
}

Answer 1

由于您要处理的是特异性问题，因此基本上不可能编写一个既有效又不影响理论性能的选择器。 .param_indent 不如 .border td 具体，因此该选择器下的声明不会优先。

其他可能解决特异性问题的选择器包括 .border .param_indent，但由于后代选择器因性能“最差”而臭名昭著，考虑到 .border entry 本身无论如何都由后代选择器组成，你真的无法从你的 CSS 的这个特定部分中获得更多的效率。

所以我在这里只能说坚持使用 td.param_indent。如果要认真对待后代选择器点，那么 td.param_indent 可以说比 .border .param_indent 这样的东西要好，对于某些“更好”的定义，无论如何，甚至使用类型选择器。

此外，除非您自己花时间分析页面呈现，否则您永远无法确定它是更好了，还是实际上会变得更差。