CSS LESS 占位符混合

Question

我想创建一个占位符混合，如下所示。但是，这无法在 LESS 版本 1.7.0 中编译。

.placeholder(...) {
    ::-webkit-input-placeholder: @arguments;
    :-moz-placeholder: @arguments;
    ::-moz-placeholder: @arguments;
    :-ms-input-placeholder: @arguments;
}

Answer 1

Mixin 允许任何占位符 css 规则。

.placeholder(@rules) {

    &::-webkit-input-placeholder {
        @rules();
    }
    &:-moz-placeholder {
        @rules();
    }
    &::-moz-placeholder {
        @rules();
    }
    &:-ms-input-placeholder {
        @rules();
    }
}

示例用法:

.placeholder({
    color: #0000FF;
    text-transform: uppercase;
});