//mixin--Simple reference, Example:.border-radius (@radius){-webkit-border-radius:@radius;-moz-border-radius:@radius;Border-radius:@radius;}. Calluse{. Border-radius (5px);}--with default values, parameter is optional, Example:.border-radius (@radius: 5px){-webkit-border-radius:@radius;-moz-border-radius:@radius;Border-radius:@radius;}. Calluse{. Border-radius;}//output Css.calluse{-webkit-border-radius:5px;-moz-border-radius:5px;Border-radius:5px;}--Multi-parameter invocation, Example:.test (@height, @width, @border, @color){Height:@height;width:@width;Border:@border;Color:@color;}. Study{. Test (100px,500px,2px,red);}//output Css.study{Height:100px;width:500px;Border:2px;Color:Red;}--Mixed multi-parameter, Example:.test (@width){//One-parameter callable width:@width;}. Test (@width, @padding: 2px){//One parameter can be called, one optional min-width:@width;padding:@padding;}. Test (@width, @padding, @margin: 2px){//Two can be called, one parameter optional max-width:@width;padding:@padding;margin:@margin;}//one-parameter invocation. Study{. Test (500px)}//output Css.study{width:500px;Min-width:500px;padding:2px;}//Two parameter call. Study{. Test (500px,5px);}//output Css.study{Min-width:500px;Max-width:500px;padding:5px;margin:2px;}//named parameter call. Study{. Test (@width:500px);}The compilation result is the same as when a parameter is called. Study{. Test (@width:500px, @padding: 5px);}The result of the compilation is the same as when the two arguments are called [email protected] multi-parameter calls. Box-shadow (@x:0; @y:0; @blur: 1px; @color: #000){-webkit-box-shadow:@arguments;-moz-box-shadow:@arguments;Box-shadow:@arguments;}. Test{. Box-shadow (2px; 5px);}//output css.test{-webkit-box-shadow:2px 5px 1px #000;-moz-box-shadow:2px 5px 1px #000;Box-shadow:2px 5px 1px #000;}Summary: Non-declared parameters (parameters without default values) are separated from undeclared parameters with "," separating the declared parameters (parameters with default values) from the declared parameters (this is not very understanding of @rest)
Leona
Original link: http://www.cnblogs.com/leona-d/p/6296828.html
Copyright NOTICE: This article is copyright to the author and the blog Park is shared, welcome to reprint, but without the consent of the author must retain this statement, and in the article page obvious location to give the original link
Less-minxin Pass