css - 同じ親を持つcssセレクターを単純化する

Question

.content p, .content ul, .content h1 {
       text-indent: 35px;
}

このセレクターのショートカットはあります.content p, ul, h1 {}か？

                                                                                                 

Answer 1

通常のCSSでは、選択の余地はありません。

SASSやLESSなどのCSSコンパイラを使用すると、次のように記述できます。

.content {
    .p, ul, h1 {
        text-indent: 35px;
    }
}

私は最近、CSSの作成をとても楽しくするCompassを使用することを強くお勧めします。

Answer 2

セレクターレベル4（別名CSS 4）には:matches()機能的な疑似クラスがあります。

.content :matches(p, ul, h1) {
  text-indent: 25px;
}

ただし、まだどのブラウザでもサポートされていません。しかし、ChromeとFirefoxにそれぞれ同じ機能をもたらすものが:-webkit-any()あります。:-moz-any()