JIT运行时编译

下载less的js库：less.min.js

直接在html中编写less代码，引入less的js库，运行时编译。

该方式不是预编译，不推荐使用。

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>less_test01</title>
  6.     <!-- 直接在此处编写less代码，注意此处的type为text/less -->
  7.     <style type='text/less'>
  8.         #wrap {
  9.         position: relative;
  10.         width: 300px;
  11.         height: 400px;
  12.         border: 1px solid;
  13.         margin: 0 auto;
  14.             .inner {
  15.                 position: absolute;
  16.                 left: 0;
  17.                 right: 0;
  18.                 top: 0;
  19.                 bottom: 0;
  20.                 margin: auto;
  21.                 background: pink;
  22.                 height: 100px;
  23.                 width: 100px;
  24.             }
  25.         }
  26.     </style>
  27. </head>
  28. <body>
  29.     <div id="wrap">
  30.         <div class="inner">
  31.         </div>
  32.     </div>
  33. </body>
  34.     <!-- 引入less的js库 -->
  35.     <script src="less.min.js"></script>
  36. </html>