html – 如何使用CSS专门定位此元素id？

我有一个CSS选择器#checkout form.center已经被使用了

我想特别为确认表格覆盖这一点,但我尝试写的东西都没有应用.我认为#confirmation form.center或其他东西应该取代第一条规则,但它似乎甚至没有达到目标. #confirmation被上面提到的选择器覆盖,因为它不是特定的.

最佳答案

扩展BoltClock的答案：

每个CSS选择器都有一个specificity值.对于每个元素,如果其属性之一的值发生冲突,则具有最高特异性的规则优先.通常,CSS选择器中的信息越多越好,其特异性就越大.

因此,添加适合您现有选择器的内容(#checkout form.center)将使您可以覆盖它：

#checkout form.center {
  /* your existing CSS */
}

#checkout #confirmation {
  /* your overrides; this has higher specificity */
}

#checkout form#confirmation {
  /* this would also work -- even higher specificity */
}

#checkout form#confirmation.center {
  /* even higher */
}

#checkout form.center p {
  /* works inside the p only,but also has
     greater specificity than #checkout form.center  */
}