我有以下 SCSS mixin,我可能为此写了太多多余的东西:

@mixin radius($topleft, $topright: $topleft, $bottomright: $topleft, $bottomleft: $topleft) {

    -moz-border-radius-topleft:     $topleft;
    -moz-border-radius-topright:    $topright;
    -moz-border-radius-bottomright: $bottomright;
    -moz-border-radius-bottomleft:  $bottomleft;
    -webkit-border-radius:          $topleft $topright $bottomright $bottomleft;
    border-radius:                  $topleft $topright $bottomright $bottomleft;

}

请注意,参数可以采用单个值来应用于所有方面,也可以采用所有 4 个值进行自定义。

最佳答案

您可以将前四行合并为:

-moz-border-radius: $topleft $topright $bottomright $bottomleft;

除此之外,如果您想保留能够为不同边指定单独值并保持代码跨浏览器兼容的选项,则您无法再减少代码。
moz-borer-radius 的语法
-moz-border-radius: { { length | percentage }  1 to 4 values | inherit } ;

关于css - 如何简化这个 SCSS 边框半径 Mixin? -- Sass 初学者,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/8116029/

10-13 05:06