1

我使用http://www.patternify.com生成了一些背景图像 css 代码，并将它们添加到名为 backgrounds.less 的 .less 文件中。当我保存文件并通过编译器运行它时，它给了我一个解析错误。我似乎无法解决这些错误。

我已将每个背景定义为一个变量，并使用 @import "backgrounds.less" 将文件导入到我的主要 styles.less 样式表中；

我得到的确切错误是：

ParseError：/Volumes/Clients/htdocs/gobet2/less/backgrounds.less:1:145 1 @headerbg {background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADCAYAAABWKLW/AAAAIElEQVQIHWP8DwQMQHD6yVcGBhDn1OMvIOo/A4wB4gAAAAACZQ50CYIIY42重复MAAAAAAAACZQ50CYIIY42)中的第1行语法错误;}[0米

（此操作是由更改 backgrounds.less 触发的）

代码如下。

@headerbg {background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADCAYAAABWKLW/AAAAIElEQVQIHWP8DwQMQHD6yVcGBhDn1OMvIOo/A4wB4gAACZQd0vY42rMAAAAASUVORK5CYII=) repeat;}
@navbg {background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADCAYAAABWKLW/AAAAIUlEQVQIHWN8+fL5fwYgeP/uEQMTjCEoJMfABBIBMUAAADLvDH2vTm1NAAAAAElFTkSuQmCC) repeat;}
@subnavbg {background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADCAYAAABWKLW/AAAAIElEQVQIHWP8DwQMQHD3zgUGBhDnzu3zIOo/A4wB4gAAA+UdgeoweSoAAAAASUVORK5CYII=) repeat;}
@footerbg {background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADCAYAAABWKLW/AAAAIElEQVQIHWP8DwQMQPDs2TMGBhDn6dOnIOo/A4wB4gAADVod/MNEi1EAAAAASUVORK5CYII=) repeat;}
@basebg {background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAFElEQVQIHWN8+/b5fwYgYAIRIAAAOj4DxOCeCacAAAAASUVORK5CYII=) repeat;}

任何帮助或解决方案将不胜感激。

谢谢。

4

1 回答 1

0

变量可以包含一个值（不是任意规则）。所以你可以定义

@headerbg: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADCAYAAABWKLW/AAAAIElEQVQIHWP8DwQMQHD6yVcGBhDn1OMvIOo/A4wB4gAACZQd0vY42rMAAAAASUVORK5CYII=) repeat;

（注意:变量名后面的）及以后使用

#header {
  background: @headerbg;
}
于 2012-10-19T13:16:57.887 回答