less与scss的差异
这里只记录使用上的差异,如果less和scss都不会的需自己先去学习其中一种的使用方式
| less | scss | |
|---|---|---|
| 变量声明 | @,例如:@width: 10px | $, 例如: $width: 10px |
| 变量引明 | width: @width | width: $width |
| 混合申明 | 和写一般样式一样,例:.flex{ display: flex; } | 使用@mixin标识,例: @mixin flex{ display: flex;} |
| 混合引用 | .flex() | @include flex() |
| 嵌套 | {} | {} |
| 父选择器的标识符 | &, 例:&:before { width: 2px; } | &, 例:&:before { width: 2px; } |
| 运算 | +、-、*、/ | +、-、*、/、% |
| 嵌套 | .flex() | @include flex() |
| 嵌套 | .flex() | @include flex() |