TamZam TamZam - 1 month ago 18
Less Question

I can not start with Less. Could you help me to start learn?

I try to start with Less but i am not sure what i am doing wrong. It is a very simple example, but i can not see the color that i use in the variable.

Do you have any idea?

enter image description here

HTML

<html>
<head>
<title>Ejemplo1</title>
<link rel="stylesheet" type="text/css" href="style.less">
<script src="//cdnjs.cloudflare.com/ajax/libs/less.js/2.7.1/less.min.js"></script>
</head>

<body>
<div class = "num1"></div>
<div class = "num2"></div>
<div class = "num3"></div>
</body>

</html>


LESS

@color1:red;

div{
border: solid;
margin:20px;
}

.num1{
width: 200px;
height: 400px;
background: @color1;
}

.num2{
width: 400px;
height: 200px;
background: @color1;
}

.num3{
width: 300px;
height: 300px;
background: @color1;
}

Answer

Yes! Sorry was maybe a silly question but the answer is:

<link rel="stylesheet/less" type="text/css" href="style.less" />