Less defined variables

1. Definitions:

Use the @ symbol to define the variables in the beginning is @ Less is variable, on naming variables, we can refer to rules named js, after all, it is to do the front, has a habit will help us unify unified style. Naming personal recommendation variable names use camel nomenclature. The first word the first letter lowercase, beginning from the second word first letter capitalized. As boxAaa, boxBbbb, boxContainer, ......, of course, but the use of sausage nomenclature with an underscore "_" to name. Such as, box_main, border_bottom, ......

2. Use:

As used style property values, the variables can be called directly @variable;

In other places, including a selector names, attribute names, URL and use @import statement, the variable must be used in the form of interpolation, for example:

Copy the code
@variable: 200px; // style property value defined as a variable used 
@classname: .nav_a; // variable values are not available in chain lines, for selecting the variable name as an interpolation 


@ { className {} // must be added as the interpolation } {  width: @Variable; // called directly as an attribute value  }
Copy the code

Output:

.nav_a {
  width: 200px;
}

Guess you like

Origin www.cnblogs.com/xiaozhang666/p/11331115.html