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. P2296 寻找道路

    #include <bits/stdc++.h> using namespace std; const int maxn = 10005; set<int> to[maxn]; ...

  2. jdbc 日期时间相关的类型

    jdbc 日期时间相关的类型 1.sql.Date sql包中的日期类Date是util包中Date类的子类,实际上也是util.Date类的子集.它只处理年月日,而忽略小时和分秒,用以代表SQL的D ...

  3. TabHost详解

    [转]http://blog.csdn.net/harvic880925/article/details/17120325 前言:今天仔细研究了下TabHost,主要是为了实现微信底部导航栏的功能,最 ...

  4. 关于使用UDP(TCP)跨局域网，NAT穿透的心得

    前言:        最近我用java做了一个C/S的类似QQ之类的IM系统(即时通讯系统),遇到了不能跨局域网通讯的问题,经过在网上,和书上查阅了一些资料,了解了一些情况,现在就总结一下我的解决方案 ...

  5. 判断是否是 首次 进入app，，以及Xcode7之后前导页的设置

    我的解决方案:... 1.在appdelegate.m中找到 “application:didFinishLaunchingWithOptions:”方法, 添加以下代码: /** *      前导 ...

  6. Selenium2学习-026-WebUI自动化实战实例-024-获取页面元素

    非常简单的方法封装,就不啰嗦了,直接上码咯 ^_^ /** * Get element. It will be return null when there is not such element. ...

  7. CSS：选择器大全

    一.概念: CSS主要的作用就是给网页中的dom元素设置样式,选择器则是用来匹配dom元素的. CSS中的选择器有很多种,常用的分别是标签选择器(根据元素标签名称),类选择器(根据元素class属性) ...

  8. Web页面上的控件

    Web页面,即:.aspx文件页面的根目录下,分为了5部分 [0]-{System.Web.UI.LiteralControl} [1]-{System.Web.UI.HtmlControls.Htm ...

  9. ant简述

    1,什么是antant是构建工具2,什么是构建概念到处可查到,形象来说,你要把代码从某个地方拿来,编译,再拷贝到某个地方去等等操作,当然不仅与此,但是主要用来干这个3,ant的好处跨平台   --因为 ...

  10. 重新拷贝 新项目 发现不显示 原来是 paramiko 没有装

    proxy pass 端口换成 另一个 跟原来的不冲突 [root@ayibang-server soft_ware]# cp s10day11/demo.* s10ops/[root@ayibang ...