• 体验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的代码重用率还是非常高的,但是前提要想到并且编译他,这个需要事先的理解和规划。

      

  • 相关阅读:
    更换惠普G32笔记本的风扇和硬盘,内存条, 谨记 要做好CPU和显卡的 导热硅脂工作!
    怎么更新 WIN10里的SMBv1协议
    ubuntu-12.04.5-desktop-amd64 安装vmwaretools
    如何解决“ VMware Workstation 不可恢复错误: (vcpu-0) vcpu-0:VERIFY vmcore/vmm/main/cpuid.c:386 bugNr=1036521”
    联想移动硬盘无法访问 解决方法1
    阮一峰 ---开发者手册
    Earth Wind 一个查看全球风向的网站
    Linux帮助用法
    Linux历史命令管理以及用法
    Linux操作练习
  • 原文地址:https://www.cnblogs.com/wangjunjunjiayuan/p/4658757.html
Copyright © 2020-2023  润新知