0

現在、すべての css セレクターを書き留めていますが、見栄えが悪いです。

.selector1 .selector2 .item1 {
    ...
}

.selector1 .selector2 .item2 {
    ...
}

.selector1 .selector2 .item3 {
    ...
}

次のようなものを作る方が良いでしょうか？

.selector1 .selector2 {

    .item1 {
       ...
    }

    .item2 {
        ...
    }

    .item3 {
        ...
    }
}

style タグの scoped 属性は知っていますが、私にとってはインライン化の別の方法です。この種のスコーピングが利用可能かどうかは誰にもわかりませんか?

4

2 に答える 2

1

CSS はこの構文をサポートしていませんが、一般的な CSS プリコンパイラにはLESSとSASSの 2 つがあります。コンパイラ以外の違いはほとんどありません。SASS は Ruby ベースのコンパイラーを使用し、LESS は JavaScript コンパイラーを使用します。私は Ruby ではなく JavaScript を開発しているので、扱いやすいと考えています。

さらに、このようにlessファイルをHTMLコードに直接埋め込むことができます

<link rel="stylesheet/less" type="text/css" href="styles.less" />
<script src="less.js" type="text/javascript"></script>

もちろん、LESS の Web サイトからダウンロードできる JavaScript コンパイラが必要です。Web サイトを起動する前に、LESS ファイルを通常の CSS にコンパイルする必要があります。

ネストについては、LESS のドキュメントを参照してください。

于 2013-04-04T09:38:38.010 に答える