0

「&」連結セレクターを使用して一連のネストされたルールを持つファイルを LessCSS で処理する際に、実際の問題が発生しています。

たとえば、次はエラーなしで機能します。

.grey-table {
    background: #EDEDED;
    tr {
        th {
            background: #DEDEDE;
        }
        td {
            color: #888;
        }
        &:nth-child(odd) {
            td {
                background-color: #F9FCFF;
            }
        }
        &:nth-child(even) {
            td {
                background-color: #EDF5FF;
            }
        }
        &:hover {
            td {
                background-color: #DFEAF9;
            }
        };
    }
}

ただし、色を関数 (任意の種類 - 定義済みまたは mixin) に変更すると、エラーが発生します。

" 12 行目の構文エラー - 未定義"

 .grey-table {
    background: desaturate(#EDEDED, 100%);
    tr {
        th {
            background: desaturate(#DEDEDE, 100%);
        }
        td {
            color: desaturate(#888, 100%);
        }
        &:nth-child(odd) {
            td {
                background-color: desaturate(#F9FCFF, 100%); <------ Line 12
            }
        }
        &:nth-child(even) {
            td {
                background-color: desaturate(#EDF5FF, 100%);
            }
        }
        &:hover {
            td {
                background-color: desaturate(#DFEAF9, 100%);
            }
        };
    }
}

これに関する参考資料は見つかりませんが、私だけではないはずです。

どうもありがとう。

4

3 に答える 3

3

私は通常、最初に色を定義してから関数で呼び出します。

@mycolor: #F9FCFF;
desaturate(@mycolor, 100%);

申し訳ありませんが、less ページのコードにエラーはありません: http://less2css.org/

(<---12 行目なしで) 貼り付けてみると、うまくいくことがわかります。おそらく、ページ上の less スクリプトと対話する javastript を使用している可能性があります。

編集: 末尾に、less パーサーの古いバージョン (<=1.3.1) を壊すセミコロンもあります。私がそれを取り出すと、それはすべてのバージョンでうまく解析されます...そして私はあなたのエラーを再現することができません.

于 2013-02-27T12:36:07.927 に答える
1

私はばかで、コロンの後の 12 行目のタブに気づいていませんでした。

それがエラーの原因でしたが、CSS mixin/variable が少ない場合のみです。すべてにお詫び申し上げます。

于 2013-03-01T11:19:24.107 に答える
0

Martin に同意します。上記のコードとhttp://less2css.org/のコンパイラを使用してエラーを再現することはできません。12 行目の構文エラー メッセージを再現できる唯一の方法は次のとおりです。

  1. プロパティの後のコロンを削除しbackground-colorます。
  2. 最後のセミコロンの後にコメントに関係のない文字を追加します (メモ<--- line 12は無効ですが、上記の図にそれを入れたと確信しています)。
  3. (a) 色、(b) パーセンテージ、または (c) 括弧のいずれかの後に終了引用符を追加します。(b) の例 - 100%'. 他の文字も原因となる可能性がありますが、構文エラーなしで css に直接出力されるものもあります。
  4. y background-colorまたはのように、プロパティ名の前にスペースまたはプロパティ名として無効な文字で区切られた文字*background-color。

明らかに、上記のコードにはそれらのいずれも存在しませんが、実際のコードに、問題の原因となっている可能性のある余分な文字や欠落した文字がないことを再確認してください。

于 2013-02-27T15:21:50.903 に答える