你好,莱丝小姐
还没有认识sass小姐,经过几天短短的了解我觉得less已经挺好的了.
她是模块化的
说起css的模块化,大家都能想到不用less也可以做到:
- 写一个
common.css
基本是一个网站,或者一个项目里的公共的样式都放在这里(通常这里面包括用于样式reset的css),每个页面都要使用<link>
标签引用它,每个页面也可以进行个性化的覆盖common
中的样式. - 写若干个组件化的样式,在需要的页面中进行引用.
- 每个页面有一个只限于本页面使用css,用于本页面的样式设定,这个样式文件不会影响到其他页面.
样式模块化了,便于修改维护.如果每个页面的公共样式需要修改,那么我们找到这个公共的样式文件,修改后,就引用到了所有引用其的页面.
但是这样一来,造成了每个页面对样式文件的请求数较多,一个页面需要引用,公共样式文件,若干组件的样式文件,还有本页面的文件.
你可以说,合并在一起就好了,使用某个工具,手动将需要的页面合并在一起,然后,每个页面就只需要引用一个样式文件了.
她(less)是自动的
- 对应上面说的文件合并的问题,lessc 命令行工具会,根据样式文件中的
@import
语句,按照css文件的依赖关系,自动将import进来的文件合并进来,比如:有a.less,b.less,c.less 文件,c.less 引用 b.less, b.less 引用 a.less. 但我们使用lessc 对c.css 文件进行处理的时候,lessc 会自动把 a.less 和 b.less 文件合并到 c.less.并编译成一个css文件. - less 还提供一个开发环境的工具(当然如果用在生产环境也可以就是性能降低,不推荐): 一个 less.js,这个文件的功能是,对页面中引用的主less文件,进行解析,使用ajax动态加载,其引用的其他less文件,最终,编译成css样式并在页面的
<head>
标签中创建<style>
标签把编译好的css样式放进去. - less.js 提供了一个 watch() 方法,定时去重新加载页面引用的less文件和其引用的less 文件,进行样式的刷新,便于开发,调试.
我对她没那么了解
包括她提供的若干内置函数,还没怎么用过,我相信还有很多更加重要的特点,没有提到(变量,mixin,extend…).你用了才知道.先说这么多.