introcuding less css with less.js, using webcompiler ext
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的更多相关文章
- jquery,js引入css文件,js引入头尾
jquery,js引入css文件,js引入头尾 今天在项目中,需要把20多个页面加上头和尾部,头和尾是我写的,所以小师傅把这个工作交给我了. 我开始往里面加,先引入common.css,在body开始 ...
- css文件和js文件后面带一个问号
经常看一些网站页面源代码中的css文件和js文件后面带一个问号,后面跟着一连串数字或字符,这是干什么用的? 这个方法我也用过,而且很好用?,它的作用有两个:1.作为版本号,让自己方便记忆.查找:2.作 ...
- AmazeUI(妹子UI)中CSS组件、JS插件、Web组件的区别
AmazeUI(妹子UI)是非常优秀的国产前端UI,现在来介绍一下AmazeUI中CSS组件.JS插件与Web组件的区别. CSS组件顾名思义就是仅使用CSS渲染而成的组件,而JS插件也很容易理解,就 ...
- 前端自动化(三) 合并压缩css、压缩js、添加时间戳、打包上线操作
前端自动化(三) 合并压缩css.压缩js.添加时间戳.打包上线操作 此文在前两篇基础上对比参考,会很方便理解 gulp.task("delete",function(){ r ...
- css文件和js文件后面带一个问号----2015-1103
经常看一些网站页面源代码中的css文件和js文件后面带一个问号,后面跟着一连串数字或字符,这是干什么用的? 这个方法我也用过,而且很好用?,它的作用有两个:1.作为版本号,让自己方便记忆.查找:2.作 ...
- amazeui中css组件、js组件、web组件的区别
amazeui中css组件.js组件.web组件的区别 一.总结 一句话总结: 1.可直接像调用js插件那样调用:在AmazeUI(妹子UI)中,Web组件可以不编写模板而直接使用,若如此,则与JS插 ...
- Web高性能动画及渲染原理(1)CSS动画和JS动画
目录 一. CSS动画 和 JS动画 1.1 CSS动画 1.2 JS动画 1.3 小结 二. 使用Velocity.js实现动画 示例代码托管在:http://www.github.com/dash ...
- 高性能Web动画和渲染原理系列(1)——CSS动画和JS动画
[摘要] 介绍CSS动画和JS动画的基本特点,以及轻量级动画库velocity.js的基本用法. 示例代码托管在:http://www.github.com/dashnowords/blogs 博客园 ...
- 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 ...
随机推荐
- ArcGIS Server发布服务,报错00032
错误00032 独立表数据源无法访问 00032: 修复已断开的数据连接,具体做法是将每个独立表的数据源都设置为正确的位置. 或者,如果不需要该表,将其从文档中移除. 建议在ArcMap中重新加载数据 ...
- 后半部分样式和JS前半部分脚本语言
样式 剩余样式: 1.<div style=display:"none"></div>:nono 是隐藏该元素内容,block是显示该元素内容 2.< ...
- 冒泡排序与插入排序(C#实现)
本人应届生面试,发现被问了2次关于排序的算法.当时竟然没写出来!!!好吧,可能是用库函数多了,很久没搞算法了,在纸上写没感觉吧. 今天花了1个多小时写了下冒泡排序与插入排序(C#实现),并写了注释和小 ...
- Bootstrap 表格和按钮
一.表格 1.条纹状表格 行产生一行隔一行加单色背景效果 注:表格效果需要基于基本格式.table <table class="table table-striped"> ...
- BLE链路层状态机
BLE的Link层,应当是了解BLE需要首先熟悉的一部分,BLE的Controller部分主要都在围绕这一部分实现的.Link层的内容规定了BLE底层是怎么实现蓝牙设备之间的控制,数据传输等等的.Li ...
- 最大子序列和 o(n)
问题: 给定一整数序列A1, A2,... An (可能有负数),求A1~An的一个子序列Ai~Aj,使得Ai到Aj的和最大 例如:整数序列-2, 11, -4, 13, -5, 2, -5, -3, ...
- mysql基本sql语句大全(提升用语篇)
1.说明:复制表(只复制结构,源表名:a 新表名:b) (Access可用) 法一:select * into b from a where 1<>1(仅用于SQlServer) 法二:s ...
- 【指标测试】影响IOPS的几个重要因素
1. 读写方式 顺序读写的IOPS要比随机读写的IOPS高.100%顺序读写来讲,顺序读要高于顺序写.100%随机读写来讲,随机读要高于随机写.小块读写的IOPS要比大块读写高.需要根据实际的应用程序 ...
- svnChina的使用方法
粘贴svn里面项目的地址到Versions里面,这时候,就会显示里面文件夹,将鼠标点击在文件夹上,点击checkout,选择本地要存储的位置,项目就会导出在本地的文件夹.
- JavaWeb学习笔记(一)Mac 下配置Tomcat环境
最近,想鼓捣与服务器端的交互,只能自己搭建环境了. 上个周一鼓捣了一点,周五再鼓捣,发现忘得已经差不多了.好记性不如烂笔头,还是记录下来比较好. 首先,去Tomcat的官网,下载Mac版的Tomca ...