This time I will show you how to install and use Less, and what are the precautions for Less installation and use. The following is a practical case, let’s take a look.
node.js installationOfficial website: http://nodejs.cn/<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="style.css" rel="external nofollow" /> </head> <body> <p id="box"> <ul> <li>你好</li> <li>hello</li> </ul> </p> </body> </html>
#box{ width:200px; height:200px; background-color:blue; ul{ color:white; li{ line-height:50px; } } }
is as follows:
https:// less.bootcss.com/
Variables@red:red; @w:200px; #big{ width:@w; height:@w; background-color:@red; #small{ width:@w; height:@w; background-color:@red; } } p{ color:@red; }
.bt{ width:200px; height:200px; border-top:2px solid red; background-color:red; } #big{ .bt; #small{ .bt; } }
#box{ width:100%; height:60px; background-color:#ccc; h3{ width:100%; height:20px; background-color:yellow; } ul{ list-style:none; li{ height:40px; line-height:40px; float:left; padding:0 10px; } } }
@color:#333; #box{ width:100%; height:60px; background-color:@color+#111; } •calc() @var:50vh/2; #box{ width:calc(50% + (@var - 20px)); }
@base:#f04615; @width:0.5; #box{ width:percentage(@width); color:saturate(@base,5%); background-color:spin(lighten(@base,25%),8); }
//单行注释// /*多行 注释*/ •引入其他less文件 @import "other.less";
node koa2 mysql bootstrap to build the front and back ends of the forum
The above is the detailed content of How to install and use Less. For more information, please follow other related articles on the PHP Chinese website!