When working with variables in Less, you have to realize that the last declaration wins and that Less uses lazy loading. The theoretical aspect of lazy loading is that the variables are initialized at the point at which they are used. Coding Less means you can use variables before you declare them. You can declare these variables later. When you declare a variable with the same name twice, the last declared value will be used everywhere in your code.
For this recipe, you will have to create an example.less
and index.html
file, which load the Less file and less.js
compiler with the following code in the head
section:
<link rel="stylesheet/less" type="text/css" href="example.less"> <script src="less.js" type="text/javascript"></script>