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;
}

明白了吧

时间: 2024-10-15 00:21:23

less 之Extend 及 Extend all用法的相关文章

jQuery $.extend $.fn.extend

<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script type="te

jQuery为开发插件提拱了两个方法:jQuery.fn.extend(); jQuery.extend();

jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(); jQuery.extend(); jQuery.fn jQuery.fn = jQuery.prototype = { init: function( selector, context ) {//…. //…… }; 原来 jQuery.fn = jQuery.prototype.对prototype肯定不会陌生啦. 虽然 javascript 没有明确的类的概念,但是用类来理解它,会更方便. jQuery

jQuery函数继承 $.extend, $.fn.extend

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Test jQuery Extend</title> <script src="jquery-1.12.4.min.js"></script> <script> (function($){ /*类插件

jQuery的$.fn.extend和$.extend使用

<span style="font-size:14px;">这是jQuery的简单封装,在函数里怎么写,都可以</span> <span style="font-size:14px;">调用也很简单 </span> <span style="font-size:14px;">$.ltrim();</span> <span style="font-size:14

JQ源码分析(2.0.3)---$.extend() $.fn.extend()

$.extend():作为扩展工具方法 $.extend({ aaa:function(){ alert(123); }, bbb:function(){ alert(456); }}) $.aaa();$.bbb(); $.fn.extend():作为jQ的实例方法 $.fn.extend({ aaa:function(){ alert(123); }, bbb:function(){ alert(456); }}) $().aaa();$().bbb(); 深拷贝和浅拷贝 var a = {

jQuery $.extend()用法

$.extend()用法总结. jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(object); jQuery.extend(object); jQuery.extend(object);为扩展jQuery类本身.为类添加新的方法. jQuery.fn.extend(object);给jQuery对象添加方法.这个应该很好理解吧.举个例子. <span style="font-size:18px;"><html> <hea

python中的 list (列表)append()方法 与extend()方法的用法 和 区别

append()方法使用 首先看官方文档中的描述: list.extend(L)             Extend the list by appending all the items in the given list; equivalent to a[len(a):] = L. 翻译成汉语就是:        通过将所有元素追加到已知list来扩充它,相当于a[len(a):]= L 举个例子,更能明白这句话 >>> la [1, 2, 3] >>> lb [

五.jQuery源码解析之jQuery.extend(),jQuery.fn.extend()

给jQuery做过扩展或者制作过jQuery插件的人这两个方法东西可能不陌生.jQuery.extend([deep],target,object1,,object2...[objectN]) jQuery.fn.extend([deep],target,object1,,object2...[objectN])这两个属性都是用于合并两个或多个对象的属性到target对象.deep是布尔值,表示是否进行深度合并,默认是false,不执行深度合并.通过这种方式可以在jQuery或jQuery.fn

jquery插件之jquery.extend和jquery.fn.extend的区别

jquery.extend jquery.extend(),是拓展jquery这个类,即可以看作是jquery这个类本身的静态方法,例如: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/