登録タグ: CSS スタイルシート 効率化 CSSメタ言語 LESS ダイナミックスタイルシート セレクター 入れ子 ネストルール 使い方 今回は、LESSの機能の中でも視覚的にわかりやすく、直感的に記述できる仕組みである入れ子ルールについてです。 入れ子とは? 入れ子とは、あるものの中に少し小さめの同じ形のものが入っている状態のことを指します。 ロシアのマトリョーシカ人形などが有名ですね。 LESSにおいては、子孫セレクターや子セレクター、隣接セレクターなどの続けて指定できるセレクターを、より直感的・視覚的にわかりやすく記述できる仕組みです。 簡単な入れ子の例 まずは入れ子にする前の例を見ていきましょう。 div{ color: black; font-size: 18px; line-height: 1.5; } div p{ margin-bottom: 1em; } div p s