html 中的代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet/less" type="text/css" href="css/style.less"/>
<script src="js/less.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div>0</div>
<ul>
<li class="special">1</li>
<li>2</li>
<li class="special"><a class="a">3</a></li>
<li>4</li>
<li>5</li>
</ul>
</body>
</html>

css中Less文件内容

@background-color:#f66;
.border-radius (@radius) {
border-radius: @radius;
-moz-border-radius: @radius;
-webkit-border-radius: @radius;
}
.border-shadow(@x,@y,@z,@color){
-webkit-box-shadow: @arguments;
-moz-box-shadow: @arguments;
box-shadow: @arguments;
}
@base-color: #111;
@red: #842210; .border{
border: 20px solid #ddd;
text-align: center;
margin-top: 3px;
.border-radius(5px);
.border-shadow(3px,3px,5px,#000);
// color: @base-color + #003300;
// 饱和度降低 10%
// border-color: desaturate(@red, 10%);
}
div{
width: 120px;
height: 120px;
background: @background-color;
.border;
}
ul>li{
width: 50px;
height: 20px;
background: @background-color;
.border;
&.special{
font-size: 40px;
.a{
color: red;
}
} }

js中的less.min.js可以自行到网上下载,最新版本的即可。

demo_02 less的更多相关文章

  1. Java多线程学习笔记

    进程:正在执行中的程序,其实是应用程序在内存中运行的那片空间.(只负责空间分配) 线程:进程中的一个执行单元,负责进程汇总的程序的运行,一个进程当中至少要有一个线程. 多线程:一个进程中时可以有多个线 ...

  2. java基础-day25

    第02天 java基础加强 今日内容介绍 u Properties的基本操作 u 反射综合案例 u BeanUtils概述及使用 第1章   Properties的基本操作 1.1  Properti ...

  3. SpringBoot从入门到精通二(SpringBoot整合myBatis的两种方式)

    前言 通过上一章的学习,我们已经对SpringBoot有简单的入门,接下来我们深入学习一下SpringBoot,我们知道任何一个网站的数据大多数都是动态的,也就是说数据是从数据库提取出来的,而非静态数 ...

  4. 初始 Tronado

    安装 pip 安装 pip install tronado 手动安装 下载tronado安装包(https://pypi.python.org/packages/source/t/tornado/to ...

  5. SpringMVC重定向路径中带中文参数

    SpringMVC重定向路径中带中文参数 springboot重定向到后端接口测试 package com.mozq.http.http_01.demo; import org.springframe ...

  6. Java常用类Date相关知识

    Date:类 Date 表示特定的瞬间,精确到毫秒. 在 JDK 1.1 之前,类 Date 有两个其他的函数.它允许把日期解释为年.月.日.小时.分钟和秒值.它也允许格式化和解析日期字符串. Dat ...

  7. 【2】Git仓库

    一.获取 Git 仓库 初始化仓库 ##基于当前目录初始化仓库 $ git init ##指定demo目录初始化仓库 $ git init demo 克隆现有仓库 ##克隆现有的仓库,默认目录名:li ...

  8. 项目打jar包和运行

    打包成jar包和部署,运行. 1.在pom.xml中加入  <packaging>jar</packaging> <groupId>com.demo02</g ...

  9. 免费 https 申请步骤,你必须知道

    不适用 https 加密的网站,基本上就等于在裸奔. 来,开始开始动手做 我的系统是 CentOS6 第一步:安装Certbot Certbot可以用于管理(申请.更新.配置.撤销和删除等)Let's ...

随机推荐

  1. Windows不能在本地计算机启动OracleDBConsoleorcl .错误代码2

    Windows 不能在 本地计算机 启动 OracleDBConsoleorcl.有关更多信息,查阅系统事件日志.如果这是非 Microsoft 服务,请与服务厂商联系,并参考特定服务错误代码 2. ...

  2. MySQL数据库建立外键失败的原因总结

    在MySQL数据库创建外键时,经常会发生一些错误,这是一件很令人头疼的事.一个典型的错误就是:Can’t create table... 的错误.在很多实例中,这种错误的发生都是因为mysql一直以来 ...

  3. FlexboxLayout 的一些基本介绍与基本用法

    1什么是 Flexbox 简单来说 Flexbox 是属于web前端领域CSS的一种布局方案,是2009年W3C提出了一种新的布局方案,可以简便.完整.响应式地实现各种页面布局,并且 React Na ...

  4. PHP如何让apache支持.htaccess 解决Internal Server Error The server …错误

    TP框架  打开 www.newtp.com/index.php/Home/Index/abc出现 如下错误: Internal Server Error The server encountered ...

  5. ASP.NET- Web.Config配置大文件上传

    在web.config中的<system.web></system.web>内加入如下代码: <httpRuntime executionTimeout="60 ...

  6. Spring技术内幕——深入解析Spring架构与设计原理(一)IOC实现原理

    IOC的基础 下面我们从IOC/AOP开始,它们是Spring平台实现的核心部分:虽然,我们一开始大多只是在这个层面上,做一些配置和外部特性的使用工作,但对这两个核心模块工作原理和运作机制的理解,对深 ...

  7. android3.2以上切屏禁止onCreate()

    一般切屏禁止onCreate()方法需要将activity加上属性: android:configChanges=”orientation|keyboardHidden” 但是在3.2以上就不起作用了 ...

  8. Kia&#39;s Calculation(贪心)

    pid=4726">http://acm.hdu.edu.cn/showproblem.php? pid=4726 大致题意:给两个长度小于10^6且相等的合法的正整数.你能够随意组合 ...

  9. 分享2D Unity游戏的动画制作经验

    作者:Alex Rose Unity近期宣布推出额外的2D游戏支持,加入了Box 2D物理和一个精灵管理器. 但这里还是有些技巧须要牢记在心.逐帧更改图像仅仅是动画制作的冰山一角,若要让你的游戏出色执 ...

  10. 一大波Java来袭(二)异常处理

    概要解析: 本章的知识点能够记为:1图+5keyword+先逮小的.后逮大的  一.基础 (一)定义 1.异常 是指在程序执行的时候发生的一些异常事件.良好的程序设计应该在异常发生的时候提供处理异常的 ...