Less Extend语法使用的一点强调
Less中的Extend语法顾名思义实现类似继承的功能,强大且实用,但需要强调一点,使用Extend时,不能Extend含有变量的选择器名称,不然会无效!
例子:
没有任何问题,会编译为:
如果使用变量呢?
在Less中看着很优雅,没毛病,编译为:
up-arrow 和 down-arrow哪去了???
技能一通甩,全是未命中,有没有?
是的,如果Extend去匹配含有变量的选择器会忽略掉,没错,就是这样,直接,干脆!
在Less官方文档中有这么一段关于这个问题的描述:
说中文?好的!
就是说关于Less是否支持变量匹配(如果含有变量的选择器,不管是在Extend匹配条件中还是定义的所需Extend的选择器)到目前为止还是一个悬而未决的提案,就是说现在不支持,以后支不支持?不知道。
结语
很Less作为强大的CSS预编译器之一,还有很多小细节值得细细品味,笔者在查阅文档的时候居然没有找到完整的Less官方中文资料,于是翻译了一份最新最完整的Less中文文档,欢迎参阅,如有问题,随时指正。逃:)
Less官方文档[英文]:http://lesscss.org/
Less官方文档[中文]: https://woolyang.github.io/less-docs-cn/