今日目标:

1:今天的学习内容是在工作完成的情况下,学习Less(之所以学习Less是因为项目中使用的是Less)-------------当前进度(0%)

注意项:

  • 务必确保在 less.js 之前加载你的样式表。
  • 如果加载多个 .less 样式表文件,每个文件都会被单独编译。因此,一个文件中所定义的任何变量、mixin 或命名空间都无法在其它文件中访问

注意,由于变量只能定义一次,其本质就是“常量”。


今日成果:

随便说点实际开发中的体会吧。
优点:
  1. 结构清晰,便于扩展。对于模块很多的应用特别是单页 app,经常需要用 selector 来划分不同模块的 CSS 的 scope。如果满眼望去全是 .module .action .list a, .module .action .list a:hover 很难直观地理解样式应用的范围;而写成
    .module {
     .action {
      a, a:hover {
       //styles
      }
     }
    }
    //other modules
    这样要清晰得多。这样可维护性必然会高很多,举个例子:如果要改变样式的应用范围,增加一个适用的 action,只需把 .action 改成 .action, .action2 即可,而纯 CSS 就悲剧了,要修改每个相关 rule set 的 selector。
  2. 可以方便地屏蔽浏览器私有语法差异。这个不用多说,封装对浏览器语法差异的重复处理,减少无意义的机械劳动。
  3. 可以轻松实现多重继承。
    .box {
     display: block;
    }
    .thick-bordered {
     border: 5px solid black;
    }
    .notice {
     .box;
     .thick-bordered;
    }
    这样无论父类有什么改动子类都会同步更新。有人说这个在 HTML 中把 class 写成 "notice box thick-bordered" 就好了,但是这样增加了HTML 与样式的耦合,如果模板中有多个 .notice 在修改时就难免做重复劳动,同时除了修改过的 CSS 文件外,客户端缓存的 HTML 模板也需要重新下载。在 LESS 中,如果利用 mixin 来作继承在编译后都无需生成无用的父类样式代码。
  4. 完全兼容 CSS 代码,可以方便地应用到老项目中。LESS 只是在 CSS 语法上做了扩展,所以老的 CSS 代码也可以与 LESS 代码一同编译。

缺点:

  1. 须要编译。无论是放在客户端还是服务器端,都是一种额外的花销。
  2. 作者更新不够活跃,对社区的力量使用不足。作者对 GitHub 上的 pull request 基本置之不理,他解释说是 GitHub 上的通知让他看不过来所以基本都无视了。所以使用中遇到的一些问题可能官方代码得不到及时的更新。


基本了解了一下Less的使用

LESS的好处的更多相关文章

  1. 使用Maven私服的好处

    1.Maven仓库的分类 本地仓库:当Maven执行编译或测试时,如果需要使用到依赖文件,它总是基于坐标使用本地仓库的依赖文件.默认情况下,不管Linux还是Windows,每个用户在自己的用户目录下 ...

  2. [C]指针有什么好处?

    指针的好处,需要和数组比较起来说.具体如下:     1.指针可以随意申请不连续的数据存储空间,而数组是连续的,如果数组空间没有全部占用,那么会造成浪费,比如你申请了a[10],缺只有5个数据输入,那 ...

  3. 单页web应用是什么?它又会给传统网站带来哪些好处?

    文章来源:<单页Web应用:JavaScript从前端到后端> 什么是单页应用? 单页应用是指在浏览器中运行的应用,它们在使用期间不会重新加载页面.像所有的应用一样,它旨在帮助用户完成任务 ...

  4. java封装好处和原则

    /*封装好处 隐藏实际细节,提供公共的访问方式 提高了代码的复用性 提高安全性 封装原则 将不需要对外提供的内容都隐藏起来 把属性隐藏,提供公共方法对其访问.*/

  5. Jquery和其他库($的好处)

    ---很多时候我们的页面 会使用很多的 javascript库 ---而这个时候  jQuery这款重点在满足社区用户的需求的工具  做好了让jQuery在页面上与其他库和平共处的准备 凭借名副其实的 ...

  6. [IOS 开发] 懒加载 (延迟加载) 的基本方式,好处,代码示例

    懒加载的好处: 1> 不必将创建对象的代码全部写在viewDidLoad方法中,代码的可读性更强 2> 每个属性的getter方法中分别负责各自的实例化处理,代码彼此之间的独立性强,松耦合 ...

  7. 【转】GPU 与CPU的作用协调,工作流程、GPU整合到CPU得好处

    在不少人的心目中,显卡最大的用途可能就只有两点--玩游戏.看电影,除此之外,GPU并没有其他的作用了.但是随着微软IE9的正式发布,不少人突然发现,微软一直提到一个名词:GPU硬件加速,从而也让不少人 ...

  8. [专业名词·硬件] 1、等效串联电阻ESR概述及稳压电路中带有一定量ESR电容的好处

        一.等效串联电阻ESR概述 ESR是Equivalent Series Resistance的缩写,即“等效串联电阻”.理想的电容自身不会有任何能量损失,但实际上,因为制造电容的材料有电阻,电 ...

  9. SQL Server配置管理器的“别名”功能好处,实现内外网统一以及加了端口号导致的限制

    这里主要有两个别名,经过研究,最好两个都配置成一样的,减少排查. 操作: 点击[别名],右键[新建别名] 这里的别名能实现比如我一台远程服务器,加了端口的,如果要实现在SQL登录的时候,使用计算机名来 ...

  10. C++ do{...}while(0)的好处

    在开源软件里面经常可以看到这样的写法. #define X(a) do { f1(a); f2(a); } while(0) 1. 主要作用是放在宏定义里面,避免宏带来的语法问题. 比如 #defin ...

随机推荐

  1. LeetCode之“动态规划”:Minimum Path Sum && Unique Paths && Unique Paths II

    之所以将这三道题放在一起,是因为这三道题非常类似. 1. Minimum Path Sum 题目链接 题目要求: Given a m x n grid filled with non-negative ...

  2. 第一个Polymer应用 - (2)创建你自己的元素

    原文链接: Step 2: Your own element翻译日期: 2014年7月6日翻译人员: 铁锚通过上一节的学习和实践, 您已经完成了一个基本的应用程序结构(application stru ...

  3. ffdshow 源代码分析 2: 位图覆盖滤镜(对话框部分Dialog)

    ===================================================== ffdshow源代码分析系列文章列表: ffdshow 源代码分析 1: 整体结构 ffds ...

  4. Mac OS 终端常用命令基础

    基础概念 OS X 采用的Unix文件系统,所有文件都挂在跟目录" /" 下面,所以不在要有Windows 下的盘符概念.比如什么"C:"你在桌面上看到的硬盘都 ...

  5. obj-c编程02:给类自动合成存取方法

    我们在此篇对obj-c编程01中的Box的例子稍加改动,一是添加的自动合成存取器,二是将Box按照其标准的写法分成3个文件,即头文件Box.h,类实现文件Box.m,以及主文件test.m. 1.Bo ...

  6. 熊猫猪新系统测试之三:iOS 8.0.2

    本来本猫要等到8.1版本出来后再做测试的,结果等来等去就是迟迟不推送更新呀!说好10月20号的iOS 8.1呢?为了一鼓作气写完,就先不等了.先拿手头的iOS 8.0.2系统做一下测试吧! 8.x系统 ...

  7. sqlite 数据类型 <转>

    一般数据采用的固定的静态数据类型,而SQLite采用的是动态数据类型,会根据存入值自动判断.SQLite具有以下五种数据类型: 1.NULL:空值.2.INTEGER:带符号的整型,具体取决有存入数字 ...

  8. 百度java开发面试题

    第一面  项目:  1.找一个项目,介绍下情况.其中遇到了什么问题,每种问题怎么样的解决方案.  算法题:  2.一个排好序的数组,找出两数之和为m的所有组合  3.自然数序列,找出任意连续之和等于n ...

  9. jquery选择器项目实例分析

    首先废话一句,jQuery选择器真心很强大!  在项目中遇到这么一个问题easyui的问题 如图所示,当前页面显示的是"原始报文查询"的页面,当时左侧导航栏却选中的是"重 ...

  10. git merge 与 rebase

    git merge git rebase merge V.S. rebase 参考材料 写在开始: 对merge和rebase的用法总有疑惑,好像两个都能完成"获取别的branch的comm ...