Question

我的文件看起来像这样：

/*Style*/
.themeStyle(){
    font-weight:normal;
    text-transform:capitalize;
    text-transform:none;
}
.styleTitleBlock(@padding; @margin){
    text-transform:uppercase;
    padding:@padding;
    margin:@margin;
    text-align: left;
}
.hideText(){
    display: inline-block;
    text-indent: -99999px;
    overflow: hidden;
    vertical-align: middle;
    text-align: left;
    float: left;
    .themeStyle();
}
.themePosition(){
    position:absolute;
    top:0;
    left:0;
}
/*color text * color text hover*/
.link(@color; @colorhover){
    color: @color;
    &:hover,
    &:focus,
    &:active {
        color: @colorhover;
        text-decoration:none;
    }
}
/*========================= Functions==================*/
/*Change Font*/
.changeFont (@font){
    font: @font;
}

/*Change Text Color*/
.changeColor (@color){
    color: @color;
}
/*Change Line*/
.changeLine (@linecolor){
    border-color: @linecolor;
}
/*Change Background Color*/
.changeBkg (@bgkcolor){
    background-color: @bgkcolor;
}
/*Change Background Image Color*/
.changeBkg (@bkgcolor; @bkgurl; @bkgname; @bkgposition; @bkgrepeat){
    background-color:@bkgcolor;
    background-image:url("@{bkgurl}@{bkgname}");
    background-position:@bkgposition;
    background-repeat:@bkgrepeat;

}

/*Change Color-Border-Background Color*/
.changeAllColor(@color; @bgkcolor){
    .changeColor (@color);
    .changeBkg (@bgkcolor);
}
.changeAllColor(@color; @linecolor; @bgkcolor){
    .changeColor (@color);
    .changeLine (@linecolor);
    .changeBkg (@bgkcolor);
}

等。我需要在没有LESS编译器的共享主机上使用它。所以我想预先编译它。

lessc functions.less  > functions.css

生成css文件，但它只包含注释 - 没有代码，没有其他css指令。我做错了什么吗？我可以解决这个问题吗？

Answer 1

您的LESS文件中只有mixins。如果没有使用，Mixins将不会产生CSS输出。有关mixins的更多信息，请参阅LESS documentation（在您的情况下，参数混合）。

尝试删除选择器后面的括号，如下所示：

.hideText {
    display: inline-block;
    text-indent: -99999px;
    overflow: hidden;
    vertical-align: middle;
    text-align: left;
    float: left;
    .themeStyle();
}

无法将LESS文件编译成CSS

1 个答案: