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;
            }
        };
    }
}

但是，如果我将颜色更改为函数（任何类型 - 预定义或混合），我会收到错误消息

“第 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 回答