css - 特定のセレクターに一致する複数のクラスを指定する方法は?

Question

CSS (ウィンク) で DRY を練習しようとしていますが、これを解決する方法に行き詰まっています。

これを減らすにはどうすればよいですか：

table.shipmentItemList TD.title,
table.shipmentItemList TD.author,
table.shipmentItemList TD.options {
    font-size: 1.0em;
    font-weight: normal;
}

このようなものに：

table.shipmentItemList TD.title, TD.author, TD.options {
    font-size: 1.0em;
    font-weight: normal;
}

または、これはさらに良い：

table.shipmentItemList TD .title, .author, .options {
    font-size: 1.0em;
    font-weight: normal;
}

Answer 1

less.js を見てください。次のようなことができます。

table.shipmentItemList{
  TD.title, TD.author, TD.options {
    font-size: 1.0em;
    font-weight: normal;
  }
}

Answer 2

この場合、SASS のみを使用できると思います: http://sass-lang.com/

標準の CSS では、あなたがしようとしていることは許されません。

Answer 3

サーバー上で行う場合は、 LESSまたはLESS PHPをご覧ください。あなたが求めていることは、バニラ CSS では不可能です。

あなたの例は次のようになります。

table.shipmentItemList {
    td {
        &.title, &.author, &.options {
            font-size: 1.0em;
            font-weight: normal;
        }
    }
}