在LESS中使用类似参数的边框宽度

问题描述

我仍在发现这项技术的实用性.请问我是否有人可以回答我.我正在尝试创建一个像这样的函数:

I'm still discovering the utility of this technology.Please I have a question if someone can answer me. I'm trying to create a function like:

.advancedBorder( @color, @size )
{
     border: @size solid @color;
}

div
{
    .advancedBorder( #FFF, 1px 0px 1px 0px);
}

因此，我尝试了多种方法使之成为可能，但没有成功.

So, I tried in many ways to make it possible but without any success.

真正的原因是创建一个可以添加到任何框的函数，并为其设置任何我喜欢的边框尺寸和颜色(最少的代码行).有人可以告诉我该怎么做吗?

The real reason is to create a function that can be added to any box and setting for it any border size and color I prefer with minimum lines of code.Can someone show me how can be done?

谢谢！

推荐答案

生成的语法在CSS中无效.您正在传递以下内容:

The syntax generated is not valid in CSS. You are passing in the following:

@color = #FFF@size = 1px 0px 1px 0px

在您的mixin中会生成:

which in your mixin will generate:

border: 1px 0px 1px 0px solid #FFF;

作为CSS.这不是CSS中边框的有效简写.您需要类似的东西:

as CSS. This is not a valid shorthand for borders in CSS. You need something like:

.advancedBorder( @color, @size ){
    border-width: @size;
    border-color: @color;
    border-style: solid;
}

这篇关于在LESS中使用类似参数的边框宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！