Question

基本上我有一些讨厌的标记：

<td colspan="2">
  <strong class="ajax_cart_quantity">8</strong>
    items
  <strong class="ajax_cart_total">
    271,60 $
  <span class="price-2"> (210,66 €)</span>
  </strong>
</td>

我格式化了代码，因此更容易阅读。在这里：我的问题：我需要给.price-2一些样式（较小的字体）。

我不能做的事：使用类或属性，因为总值是通过ajax更新和刷新的，并且将class属性赋予span.price-2会破坏json。

我能做什么：在没有类别和属性的情况下，在某些独特元素中包含第二个价格。

核心css中已经存在一些以第二价table span为目标的seletors。所以基本上我需要提出一些其他的内联元素行span，所以我可以为price 2创建自己的样式选择器。

我也需要与旧浏览器兼容的东西。谢谢

Answer 1

保留html，因为它将CSS添加到特定选择器：

table td strong span.price-2 {
    font-size: 0.8em !important;
}

仅当选择器（!important）不够具体时才添加table td strong span.price-2。

即使在古老的浏览器中也是如此。

Answer 2

就个人而言，我会使用或。它们既有效又完全支持，而且它们赋予了它们自己的一些风格，这些风格可能很有用。

但是你没有事件需要替换 - 只需使用span 而不用类并在CSS中以不同方式对其进行定位：

.ajax_cart_total span {font-size:0.8em;}

Answer 3

如果您只需要另一个（仍然）有效的内联元素，则可以使用或 - 仍然支持内联工作：）

（用于粗体，用于斜体，但在HTML中，这些文字效果最近用{{1}完成和）。 和仍然存在，尽管使用频率较低，无法实现上述文本重点。它们将被内联解释。）

跨度的替代

3 个答案: