今日目标:

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. C++模板总结

    在编写含有模板的程序的时候,我还是按照一个头文件声明,一个源文件的方法来组织,结果编译的时候总出现一些很奇怪的语法问题,但程序明明是没有问题的.后来经过查阅才知道原来是因为C++编译器不支持对模板的分 ...

  2. 安卓笔记-- ListView点击和长按监听

    其中点击监听为setOnItemClickListener() 具体实现代码如下 listView.setOnItemClickListener(new AdapterView.OnItemClick ...

  3. 杭电ACM 1004题

    原题大概意思就是统计输入字符串中,重复的最大个数! import java.util.Scanner; public class Main { public static void main(Stri ...

  4. Java内部类与外部类

    错误提示: 没有任何类型 TestThread 的外层实例可访问.必须用类型 TestThread 的外层实例(例如,x.new A(),其中 x 是 TestThread 的实例)来限定分配. pu ...

  5. w3school上系统过了一遍Jquery的总结

    下面是今天学习JQUERY中发现的一些小钻石 1:$(document).ready(function(){}); 为了防止文档在完全加载(就绪)之前运行 jQuery 代码(终于搞清了这句代码的含义 ...

  6. Spring Framework 5 中的新特性

    https://www.ibm.com/developerworks/cn/java/j-whats-new-in-spring-framework-5-theedom/index.html Spri ...

  7. SystemJS to Webpack – Before You Begin

    http://angularfirst.com/systemjs-to-webpack-before-you-begin/ This is a primer discussing why to mov ...

  8. HttpDNS的坑以及一个针对安卓不太完善的测试方案

    背景:单位因为域名劫持(具体表象是某个地区的用户ping不通域名或者因为DNS解析的ip跨网段导致访问速度很慢)需要运维经常去定位,于是提出了httpDNS方案. 想法是美好的,现实是残酷的.没引入这 ...

  9. Java经验杂谈(2.对Java多态的理解)

    多态是面向对象的重要特性之一,我试着用最简单的方式解释Java多态: 要正确理解多态,我们需要明确如下概念:・定义类型和实际类型・重载和重写・编译和运行 其中实际类型为new关键字后面的类型. 重载发 ...

  10. 学习了解CyclicBarrier

    CyclicBarrier我的理解就是一个线程等待器,用途就是将注册了这个barrier的线程卡在同一个位置,直到注册这个barrier的所有线程都完成之后,继续执行.下面是一个学习过程中采用的示例, ...