如何使用less

1.首先安装node.js

方法:查看我的博客

2.在npm节点上安装less,命令行为

npm -install -g less

3.创建一个.less文件和.hrml文件

.less

.container{
  h1{
    font-size: 25px;
    color: darkorange;
  }
  p{
    font-size: 25px;
    color: cadetblue;
  }

  .myclass{
    h1{
      font-size: 25px;
      color: cornflowerblue;
    }
    p{
      font-size: 25px;
      color: aquamarine;
    }
  }
}

.class1{

  font-size: 30px;
  color: cornflowerblue;
}


.class2{

  font-size: 100px;
  color: aqua;

}
.html

 
 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body class="container">
    <h1>113144444443</h1>
    <p class="myclass">Less 文件学习</p>
    <div class="class1 class2">test</div>
</body>
</html>

4.运行命令行
lessc style。less style.css

来源https://www.w3cschool.cn/less/less_installation.html


猜你喜欢

转载自blog.csdn.net/doudou0809/article/details/78388366