HTML5技术

新鲜出炉的less与sass较量 - 海*星(3)

字号+ 作者:H5之家 来源:H5之家 2017-04-29 09:03 我要评论( )

导入也相当符合标准。标准的 @import: ‘classes.less’; 处理的很好。然而,如果你想要导入其它的LESS文件,那么文件的扩展名是可选的,所以 @import ‘classes’; 也是可行的。如果你想要导入一些无需LESS处理的

导入也相当符合标准。标准的 @import: ‘classes.less’; 处理的很好。然而,如果你想要导入其它的LESS文件,那么文件的扩展名是可选的,所以 @import ‘classes’; 也是可行的。如果你想要导入一些无需LESS处理的内容,你可以使用 .css 扩展 (比如, @import: ‘reset.css’;)。

字符串插入

字符串也是可以用于变量中的,然后通过@{name}来调用。

@base_url : 'http://www.qianduan.net';

background-image: url("@{base_url}/images/background.png");

转义(Escaping)

可能偶尔会需要引入一个CSS中非法或者LESS无法识别的值。通常是一些IE的hack。要避免抛出异常并破坏LESS,你将需要避开它们。

.class { filter: ~; } .class { filter: progid:DXImageTransform.Microsoft.Alpha(opacity=20); }

 JavaScript 赋值

  这是LESS中我最中意的部分:在样式表中使用Javascript——相当精彩。你可以使用表达式,也可以参考环境方向来使用反单引号。

@string: `.toUpperCase()`; @string: ; @var: ~`.topUpperCase()`; @height = `document.body.clientHeight`;

 输出格式

  然而LESS并没有输出设置,而Sass提供4中输出选项:nested, compact, compressed 和 expanded。

结束语

   这两个方法有很多共同点。对写代码的设计师来说,它们都是很酷的工具,它们也可以帮助开发者更有效和快速的工作。如果你是koala或HTML的粉丝,那么Sass会是你的好助手。对我来说,一个PHP和JavaScript极客,我倾向于LESS,因为它便于引入和能够使用JavaScript的表达式以及文档属性。我怀疑我甚至接近真正理解在样式表中编程的可能行了,但是我仍坚持尝试。如果你在工作中有用到它们中的一个,或者两个都用,我很乐意听到关于它的更多内容,并看到你的成果。当然,技巧、诀窍、更正一直是很欢迎的。

 

 

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 又是新动作!微信小程序专属二维码出炉 - 腾讯攻城师lee

    又是新动作!微信小程序专属二维码出炉 - 腾讯攻城师lee

    2017-04-20 15:00

  • H5天气查询demo(二) - natureless

    H5天气查询demo(二) - natureless

    2016-05-03 14:00

  • [小北De编程手记] : Lesson 03 玩转 xUnit.Net 之 Fixture(上) - 小北@Alan

    [小北De编程手记] : Lesson 03 玩转 xUnit.Net 之 Fixture(上) -

    2016-02-21 14:00

  • 纯js移动端日期选择插件新鲜出炉 - ppk2

    纯js移动端日期选择插件新鲜出炉 - ppk2

    2016-01-14 12:50

网友点评
i