Book Image

Learning less.js

Book Image

Learning less.js

Overview of this book

Table of Contents (22 chapters)
Learning Less.js
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Installing Less on the client side


To use Less in our code, we can download it from the Less site by browsing to http://lesscss.org/#download-options-browser-downloads and then clicking on the Download Less.js v.1.7.3 button.

Save the contents of the file, displayed in the browser window as less.min.js, in a subfolder called js, under the main lessjs project folder; you will end up with something like this screenshot (this shows the files you will create later in this chapter):

In a copy of the project.html file we created at the start of this chapter, add the code as highlighted:

<!DOCType html>
<head>
  <meta charset="utf-8">
  <title>Untitled</title>
  <link rel="stylesheet/less" type="text/css" href="css/project.less">
  <script src="js/less.min.js"></script>
</head>
<body>

That's it—once this has been added, Less will compile the styles into valid CSS dynamically and render the results in the browser. The key point to note is that...