将css td / th应用于“ foo”类的所有表

Question

我找到了一种在html表格周围显示细边框的简单方法：

https://www.w3schools.com/css/css_table.asp

add_filter( 'wc_get_price_decimals' , 'custom_price_decimals', 20, 1 );
function custom_price_decimals( $decimals ) {
  if( is_product() || is_shop() || is_product_category() || is_product_tag() || is_cart() || is_checkout() ){
    $decimals = 3;
    return $decimals;
  }
}

现在，我只想将其应用于所有具有“ foo”类的表。

我尝试了这个，但这不起作用：

table {
  border-collapse: collapse;
}

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

这将更改所有table.foo { border-collapse: collapse; } table.foo, th, td { border: 1px solid black; } 标签的样式。但是我只希望在“ foo”表的正下方放置td标签。

正确的方法是什么？

Answer 1

使CSS选择像...

table.foo, table.foo th, table.foo td {
    ....

这也是对选择器的快速检查。

https://www.w3schools.com/cssref/css_selectors.asp

Answer 2

逗号分隔符表示将单独应用样式

使用：

table.foo td

然后将应用于表中类别为td的表中的所有foo

任何级别的空间均值后代。