1.html [watch out for the !js load sequence and the attribute of !rel stylesheet/less!]

<!DOCTYPE html>

<html>

<head>

    <title></title>

    <meta charset="utf-8" />

    <link href="styles/lesspractitioner.less" type="text/css" rel="stylesheet/less" />

    <script src="styles/less.js"></script>

</head>

<body>

    show less compiled

    <div class="box">

        box

    </div>

</body>

</html>

　　2.less code

@base: #f938ab;

.box-shadow(@style, @c) when (iscolor(@c)) {

    -webkit-box-shadow: @style @c;

    box-shadow: @style @c;

}

.box-shadow(@style, @alpha: 50%) when (isnumber(@alpha)) {

    .box-shadow(@style, rgba(0, 0, 0, @alpha));

}

.box {

    background-color: @base;

    color: saturate(@base, 5%);

    border-color: lighten(@base, 30%);

    div {

        .box-shadow(0 0 5px, 30%)

    }

}

　　

introcuding less css with less.js, using webcompiler ext的更多相关文章

  1. jquery，js引入css文件，js引入头尾

    jquery,js引入css文件,js引入头尾 今天在项目中,需要把20多个页面加上头和尾部,头和尾是我写的,所以小师傅把这个工作交给我了. 我开始往里面加,先引入common.css,在body开始 ...

  2. css文件和js文件后面带一个问号

    经常看一些网站页面源代码中的css文件和js文件后面带一个问号,后面跟着一连串数字或字符,这是干什么用的? 这个方法我也用过,而且很好用?,它的作用有两个:1.作为版本号,让自己方便记忆.查找:2.作 ...

  3. AmazeUI(妹子UI)中CSS组件、JS插件、Web组件的区别

    AmazeUI(妹子UI)是非常优秀的国产前端UI,现在来介绍一下AmazeUI中CSS组件.JS插件与Web组件的区别. CSS组件顾名思义就是仅使用CSS渲染而成的组件,而JS插件也很容易理解,就 ...

  4. 前端自动化(三) 合并压缩css、压缩js、添加时间戳、打包上线操作

    前端自动化(三)   合并压缩css.压缩js.添加时间戳.打包上线操作 此文在前两篇基础上对比参考,会很方便理解 gulp.task("delete",function(){ r ...

  5. css文件和js文件后面带一个问号----2015-1103

    经常看一些网站页面源代码中的css文件和js文件后面带一个问号,后面跟着一连串数字或字符,这是干什么用的? 这个方法我也用过,而且很好用?,它的作用有两个:1.作为版本号,让自己方便记忆.查找:2.作 ...

  6. amazeui中css组件、js组件、web组件的区别

    amazeui中css组件.js组件.web组件的区别 一.总结 一句话总结: 1.可直接像调用js插件那样调用:在AmazeUI(妹子UI)中,Web组件可以不编写模板而直接使用,若如此,则与JS插 ...

  7. Web高性能动画及渲染原理（1）CSS动画和JS动画

    目录 一. CSS动画 和 JS动画 1.1 CSS动画 1.2 JS动画 1.3 小结 二. 使用Velocity.js实现动画 示例代码托管在:http://www.github.com/dash ...

  8. 高性能Web动画和渲染原理系列（1）——CSS动画和JS动画

    [摘要] 介绍CSS动画和JS动画的基本特点,以及轻量级动画库velocity.js的基本用法. 示例代码托管在:http://www.github.com/dashnowords/blogs 博客园 ...

  9. set CSS style in js solutions All In One

    set CSS style in js solutions All In One css in js set each style property separately See the Pen se ...

随机推荐

  1. PLSQL 设置

    设置plsql使用特定的oracle数据库客户端来与数据库进行交互

  2. jquery的$.ajax async使用详解

      async在jquery ajax中是一个同步参数了,我们下面来给大家介绍在jquery ajax中使用async时碰到的一些问题与方法介绍,希望例子能给各位同学带来一些帮助哦.   async默 ...

  3. WeakHashMap 理解笔记

    An entry in a WeakHashMap will automatically be removed when its key is no longer in ordinary use. M ...

  4. 【Android测试】【第七节】Monkey——源码浅谈

    ◆版权声明:本文出自胖喵~的博客,转载必须注明出处. 转载请注明出处:http://www.cnblogs.com/by-dream/p/4713466.html 前言 根据上一篇我们学会了Monke ...

  5. 转:Windows Socket五种I/O模型

    原文转自:  Windows Socket五种I/O模型 Winsock 的I/O操作: 1. 两种I/O模式 阻塞模式:执行I/O操作完成前会一直进行等待,不会将控制权交给程序.套接字 默认为阻塞模 ...

  6. 兼容加载Xml字符串

    var _loadXML = function(xmlString){ var xmlDoc=null; //支持IE浏览器 if(!window.DOMParser && windo ...

  7. git push错误解决方案

    错误提示: error: The requested URL returned error: 403 Forbidden while accessing https://nanfei9330@gith ...

  8. imx6 android 进入文件系统闪屏

    imx6进入文件系统的时候都会闪屏,应该是framebuffer未初始化,就已经打开了背光.目前解决办法,在kenel阶段关闭背光,显示android的开机动画之后(此时framebuffer已经初始 ...

  9. Ioc-Autofac的使用

    serveral IoC Framework  has  already exist on the market,Take account of compenhensive factor,Autofa ...

  10. Java实现热替换

    package test; import java.io.ByteArrayOutputStream; import java.io.FileInputStream; import java.nio. ...