体验LESS CSS 框架

标签：

    LESS基于NODE.JS的一种框架性语言，它可以更好更快捷的来搭建网站框架结构；

   而后LESS 将 CSS 赋予了动态语言的特性，如 变量， 继承，运算， 函数. LESS 既可以在 客户端 上运行 (支持IE 6+, Webkit, Firefox)，也可以借助Node.js或者Rhino在服务端运行，

  但是对于我来理解中如果说他方便的话，我并不是十分认同虽然Less 的设计思路偏向原生，这个如果运用的话也比较容易上手，所以我总结了以下几个优点：

1. 需要编写的代码量明显减少了。（重用度高的话）。
2. CSS管理更加容易了，在需要更换网站样式风格时尤其如此，此时如果直接重写这些样式，工作量将会非常大，但是使用LESS就很简单，改个全局配置局可以了。
3. LESS的学习成本不是很高，与CSS规则完全融合，如果熟悉CSS，那么你也将会很快驾驭LESS。
4. 使用LESS实现配色将变得非常容易。
5. 兼容CSS3。
6. 与CSS能够很好地融合使用。在LESS代码中可以融入CSS代码，在CSS代码中也可以插入LESS语法
7. 可以配合NODE.JS来结合项目。

     然而不管什么东西一般都是有利有弊的：

1. 需要编写变量。
2. 嵌套太长会让可读性变得很

    然后是我写的代码：

@base: #f938ab;

.box-shadow(@style, @c) when (iscolor(@c)) {
  box-shadow:         @style @c;
  -webkit-box-shadow: @style @c;
  -moz-box-shadow:    @style @c;
}
.box-shadow(@style, @alpha: 50%) when (isnumber(@alpha)) {
  .box-shadow(@style, rgba(0, 0, 0, @alpha));
}
.box { 
  color: saturate(@base, 5%);
  border-color: lighten(@base, 30%);
  div { .box-shadow(0 0 5px, 30%) }
}

 LESS来说虽然相对要容易掌握，但是还是需要不断的更新和了解，这样才能更好的掌握一门框架，虽然开始来说有点抵触，觉得并没有CSS好用和直观，但是这个LESS的代码重用率还是非常高的，但是前提要想到并且编译他，这个需要事先的理解和规划。

体验LESS CSS 框架

标签：

原文地址：http://www.cnblogs.com/wangjunjunjiayuan/p/4658757.html