00:00
来走,你继续好来看一下,现在我们说let里面的主食好,CTRLCCTRLV。林珊。零三我直接叫index了。OK,为什么叫index呢?你看我现在只要换03点。C3就行了吧,是吧,来看一下,那我这边是不是得写个零三.less了,CTRLV03.less OK,那在03点量里面我做一点什么事情啊,好比如说我写点注释吧,好比如说上面我来写两个注释是不是OK啊这是。见不得人的助手是吧?OK,好,我们是什么?这是想暴露出去的。
01:06
属实,上面是大家看啊,现在我编译这个S文件,好打开考拉啊,考拉只要你开一次,然后把这个文件拖进来,我刷一下。刷一下点他干嘛去编译。编译编译。有没有编译成功,没有是不是这为什么?自行编译成功了啊,是有的吧。是是不是有的,这边好像同步的有点慢,是不是?OK来看一下03.3,你看他只给我暴露出来了这个注释吧,所以在less里面只有这种注释会会被译到C3文件里面去,你刚刚开头的注释是不会被译到C文件里面的,所以有些注释是给开发人员看的,你就用杠杠写。有些注释你想是给用户看的,你知道嘛。
02:00
杠心去写能不能理解啊?好,这里简单是不是OK,这个我给也给你们去起个名字吧。关于注释是不是OK,那再往看OK变量。变量重不重要啊,那里面肯定得有变量嘛,变量是不是我们说复用的首选就应该有变量,没有变量就不要谈复用吧,是不是?OK,咱们来看下变量。好,那变量我怎么去写CTRLC,再来一个CTRLV。零四变量。OK,那这里面来一个ctrl c ctrl d OK。零四好,怎么玩呢?零四里面大家看现在我这些零是不是都是变量啊,这个不都是什么值吧,怎么样,我说把这些零全部换成,或者说我把这个颜色我定义成一个变量是吧,你看我怎么定义at,记住let里面是用at开头的,定义变量用at开头好了。
03:06
冒号。Pink使用卡完善,看编译结果。刷一下。执行下定义。刷一下啊,可能稍微慢一点,它在变是不是出来了,看一下这个这边我们来。刷新一下是不是出来了,看零四第一遍你看。是不上来了,他是把我这个pink直接变换成这个color,想想如果这个pink这个color是我。正占的阻塞,我很多地方都要使用这个平等吗?那我以后改的话还是要一个去改样式,改一个变量就够了,这是不是我们复用了一种手段,这应该可以理解吧,OK,好,那当然变量里面还有一个东西啊,Less里面变量没有那么简单啊,来看一下。
04:01
好,那我问你,现在我是不是把一个属性值变成一个变量,OK,来看一下我们的零四,大家看我是不是把一个属性值变成一个变量,OK,我问你这种属性你是不是也可以变成变量了。OK,来看一下我什么有个变量叫做at什么N叫什么。马是不是选择性能不能变成变量。At,什么SE to,虽然说我们不这么做,可是来看一下,你看这些是不是都是别的?是吧,咋填。切记,如果你是把属性名或者选择器作为变量,在写的时候怎么曲线?At括号。S。啊,不是这个吗。嗯。懂吗?选择性呢?
05:02
一定也是加。括号的形式里面写。本来。少了一个对,少了一个井号,那我这个井号写在这边吗?直接是不是来看一下可不可以好,只要编译过一次,你在这边刷新,其实你在这边CTRLX时候就可以帮你编译了,好吗?来看一下有没有编译过来。你看我在这边干嘛,零四啊,变译变译变变异,你看或者说改一个吧,我把这个颜色改掉,我把这个颜色改成低趴。Dp pd PI是吧,来看OK,保存一下是不是就已经有了刷新了,这不就变了,那边讲一看你会帮我变译过来。马是不是也过来了啊,虽然说这种形式用的很少,可是得知道一下,如果你要把选择期跟一个什么属性你作为变量的话,调用的时候应该这么去调,在当中加一个大括号,能不能理解啊?好,这叫语法长啊,这没办法,可是这种用法我们用的很少,因为我们还是习惯性直接去写句子器跟直接去写属性名,不会把选择性跟属性名定义成变量的,懂不懂,如果你有需求需要定义了,那切记你要怎么去调。
06:25
OK,好,那这是我们说的什么?好,这是我们说的变量是不是OK,那变量里面还有一点事情就什么。那ul也一样对吧?OK,还有什么变量的延迟加载,记住CSS呢,里面的变量都是延迟加载的,好,我们来看个DEMO。啊,这个弹幕就直接去找了。Can you。好,放到这个摄像里面来吧,CTRLB变量的延迟加载,OK。
07:03
什么叫延迟加载好?大家看,现在我在外面是被。第个变量为零啊,然后我点开了是选择项啊,然后这边是不是又定个变量,你看我在哪边使用这个变量,是不是在这边去使用这变量,以及在这边去使用变量吧,首先在less里面的变量都是会计作用下。是吧,一个括号代表一个中于,一个括号代表一个中于,懂不懂,首先我们说这个括号是不是就这里面的,所以是不是要去找,去找这个变量,这个变量应该是多少。按照我们的逻辑来说,应该是二,是不是这个呢。这个变量是不是在这个块里面,跟这个块有关系吗?没有关系,好像应该是。一是吧,来看一下最终编编译成什么,刷一下。OK,这里是吧,一三往11没有没有问题啊,所以是三,为什么是三,记住在里面变量都是延迟角的,就是less里面唯一有点逻辑的地方,什么意思啊,也说我是不是要去第六行去找这个变量,它会等你这个作用于里面所有的东西全部解析完,再来看这个艾的B2是谁?
08:24
是吧,这个东西,所以它是延迟被去加载的,等它读完它才会加载这个零啊,所以这个词应该是三。那么讲这叫变量的延伸,是less里面唯一一个可能需要你去记的东西。变量的延迟加载,OK。好,有没有问题,没有问题吧,好,再来看lets中的嵌套L规则,CTRLCCTRLV,好,我们已经讲了一个嵌套规则了吧,零五嵌套规则。
09:07
好,这里CSS里面那个前端规则来看一下,这个应该改成。变量里面是不是改成零四,OK,注释里面改成零四,虽然说没有什么关系,OK看这个零五,我们改成零五是不是OK来看一下零四应该是可以用的吧。这个没问题吧,OK,我们改成零五了,OK来看一下好零五之后我们什么来写一个05点。好,这个是干嘛,大家看这是我们说什么签到规则吧,好,来看我们这个礼物里面怎么写的,好,这个把它干掉,我们写好一点,这个是。是吧,这个呢。是不是在哪,可是我们说我们不希望什么呢?嗯,大家看现在零五我们来给它编译词吧,先刷一下。
10:09
让你去执行这边。是吧,是不是出来了,OK,来看一下这个什么嵌套规则走你。没问题,是不是没有坏啊,可是他想想现在我有个需求,我说在后上去的时候把当中升本的变成粉色。怎么写来里面后上就是。是不是我问你后是不是我的一个状态啊,那我是不是应该写在它里面,是不是,那我是不应该写冒号什么。冒号ho hover它时候干嘛,白色光的是不是应该要变成另外一种颜色,比如说白色光让你变成平衡可不可以。看一下变结果吧,只要我在这边CTRLS,它就会给我去编译,是不是来看一下第给我编译成什么样了。
11:04
少了一个什么,不是多了一个什么,空格能起作用吗?不能起作用。放上去是没有任何效果的,那怎么办?我们说你不希望你你有这个空格吧,相当于我们说什么,如果你一层一层写的话,他们两层是不是父子关系啊,我不希望你们俩是父子关系,我希望你们俩。平级扣在一起加一个and。来看一下这个N代表什么?N代表你前面的垂直线,也就是外空格in捺就代表你这个N。能理解吗?来看一下最终变异成什么?看见没有?是不是当中这个空格就没了,能理解吗?好,来看一下。哎,不放上去变了吧。能不理解啊,OK,这个叫什么。来看我们讲到哪了,嵌套规则,一个是基本嵌套规则,这没有任何问题吧,父子级关系嘛,还有是N的一个使用,代表的是平级能解,那上面我是不已经讲完了,OK,那给点时间大家稍微过一过,那下面可能会稍微有点难,OK。
我来说两句