1. HTML part
<! DOCTYPE html>"http://www.w3.org/1999/xhtml">"Content-type"Content="text/html; Charset=utf-8"/> <title></title> <link rel="stylesheet/less"Type="Text/css"href="less/test.less"/> <script src="Http://cdn.bootcss.com/less.js/1.7.0/less.min.js"></script> <script></script>"Header"style="border:1px solid red;">XXXXXXXXXXXXXXXXX<p>aaaaa</p></div> <H2 style="border:1px solid blue;">1111112. less/test.less File contents
@color: #4D926F;. Rounded-Corners (@radius: 5px) {-webkit-border-radius: @radius; -moz-border-radius: @radius; -ms-border-radius: @radius; -o-border-radius: @radius; Border-radius: @radius;} #header {color: @color; . Rounded-Corners (10px);} H2 {color: @color; . Rounded-Corners;} #header {h1 {font-size:26px; Font-Weight:bold; } p {font-size:12px; A {text-Decoration:none; &: hover {border-width:1px}} }}3. Display
Note: To hang on the server, you will see the effect.
Study of Less (I.)