首页 > 代码库 > less 之Extend 及 Extend all用法
less 之Extend 及 Extend all用法
Extend 是Less的伪类,他将所放置它的选择器与匹配引用的选择器进行合并。
例如
1 a{ // a 所放置它的选择器2 background-color: #fff;3 &:extend(.b); // .b匹配引用的选择器4 border-bottom: 2px;5 }6 .b{7 font-weight: 700;8 color: yellow;9 }
编译输出:
a { background-color: #fff; border-bottom: 2px;}.b,a { font-weight: 700; color: yellow;}
那 all 怎么用呢?看如下代码:
a{ background-color: #fff; &:extend(.b all); border-bottom: 2px;}.b{ font-weight: 700; color: yellow;}.b:hover{ font-size: 2em;}
编译输出:
a { background-color: #fff; border-bottom: 2px;}.b,a { font-weight: 700; color: yellow;}.b:hover,a:hover { font-size: 2em;}
明白了吧
less 之Extend 及 Extend all用法
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。