30.尚硅谷_HTML&CSS基础_子元素的伪类.avi原创

继续啊，还有几个选择器，我们就没有几个了啊，一会儿给它说完了，然后呢，接下来我们接着来说啊，还有一些我们这个什么呀，叫做一个子元素选择器，子元素选择器其实我们已经说过了是吧，但是我们说的那个是什么呀？来一个005，哎，比如说我要选中我这写一个div div里边写一个，这个写成一个P，然后这个是什么呀，这个P是不是就是div的子元素啊，我要选中这个P元素，我怎么写呀，直接div就大于号P啊哎，这叫子元素，那接下来我们要说的是什么呢？诶还有这么几个，也是一个什么呀，伪类，这么一个子元素，一个伪类，咱们直接看这啊，诶有什么呀，叫做一个first child last，还有一个nth child，诶有什么first child child什么意思呀？孩子，诶，First child叫什么呀？第一个孩子就是第一个子元素，Last child什么呀？最后一个子元素啊，最后一个子元素，来，我们来。

看注意它们都是什么呀，是不是冒号开头啊，哎，都是一些这个，诶伪类啊，都是些伪类，那这里边我们直接来看效果啊，直接来看效果，那这边我这来写一个P标签，诶我是一个这个P标签，然后我这复制复制保存这么多P标签，那现在我要干嘛呢？哎，我想为我们这个第一个P标签设置一个什么呀？诶背景颜色为这个黄色，那我怎么写呀，我来一个P，然后直接来一个back color这什么效果呀，就是全都变成黄色了呀，而现在我只想要什么呀，只想要第一个P元素，诶第一个P元素什么叫第一个P元素，第一个这个P元素和其他P元素有什么区别呀，它是第个呀，哎，第一个，那所以我们用到什么呀，我们叫做一个冒号，叫做一个first的child first child什么意思呀？叫做第一个子元素啊，第一个子元素，所以first child可以干嘛呢？可以选中第一个子元素。

那我这么写什么意思呀？P冒号first child什么意思？你既得是P元素，同时你还得是什么呀，还得是你负元素的第一个什么呀，子元素啊，你既得是P元素，还得是你负元素的第一个子元素，那我们来看那这个P它是不是第一个子元素，它是不是我们这个包Y的这个第一个子元素，哎，所以只有什么呀，只有它一个符合要求吧？哎，来我这一保存，然后一刷新走，你是不是就选中了呀？哎，选中了啊，你既得是P元素，还得是负元素的什么呀，第一个子元素，那现在看着啊，我这来一个带带我写一什么呢？Hello，那现在问你这个P元素还会不被选中？哎，来咱们看效果，一刷新是不是没了呀，为啥没了呀？哎，因为它不是第一个子元素，第一个子元素是变成SPA了呀，哎，变成SPA了，诶那问题来了，Span怎么没变呀？哎，我这有约束吧，哎，你得是P元素啊，你得是P元素，但是我如果不写这玩意不写。

表元组是没有限制啊，哎，来一刷新走，你是不是就变了呀？哎，那不写什么意思呀，不写就相当于写了一个什么呀，芯啊，不写相来写芯任意啊任意好，那这里边注意，所以这里边注意啊first child表示找的是什么呀，第一个子元素啊，第一个子元素来，那这个我去了，我去了以后一刷新是不是就变了呀？来看着啊，来一个div，在div里放一个P元素，那现在我问你这个P元素变不变，变不变，诶我们只有两个条件，第一个你得是个P元素，它满不满足满足，第二个你得是第一个子元素，那问你这个P元素它是不是第一个子元素，诶，它是不是我们这个div的第一个子元素，诶所以你这一保存，一刷新走，你这两个是不是全变呀，为什么？因为这个它也是什么呀，也是第一个子元素，为什么呢？这个元素是包地的什么呀，第一个子元素，而这个P元素是什么呀？诶是div的第一个子元素，所以这我这么写，考不考虑的父亲。

谁不考虑它负元素，谁只要是他，他是什么呀，他是老大，我是不是给你选中啊，给你选中，那我们说了，如果我只想选中这个P元素，而不想要这个怎么办？我是不是前面接着给他加限制啊，来什么呀，Body嘛呢，大于号P，你得是什么呀，你得是body的子元素吧，同时你还得是什么呀，包地的什么呀，一个子元素是不是才行啊呀，一保存咱们再看一刷新走，你是不是就剩它了呀，因为什么呀，因为下边这是什么呀，Div的这个呀，子元素，所以注意我们这些选择剂都是干嘛呀，可以互相去结合使用的啊结合使用叫做一个first child的第一个子元素，好，接着来看我把这个东西给它，哎，给它住了啊，给它住了，然后来什么呢？我来一个叫做什么呀，P冒号一个last child，诶，Last child我们来看怎么写，Last child什么意思呀，是不是最后一个呀，哎，最后一个来一个background color来什么呢？来一个这个yellow，好，那现在问你谁变。

是不是他变呀，哎，他变一保存一刷新走，你是不是就剩这一个了，哎，就剩这一个了啊，就一个last childt最后一个子元素，那还是我在这儿给它加一什么呢？加一个这个SPA，我是SPA保存一刷新走，你没有变的了，为什么？因为是不是最后一个元素不是P了，变成谁了，变成SPA了啊last child表示是最后一个子元素啊最后一个子元素，那现在我们来看，那现在我把这div这注释啊，我给打开，我这写一个我是诶我是这个div诶中的这个P标签，我一保存，我问你这个变不变，诶那我们来刷新走，你是不是变了呀，为什么呀，因为我们这个div里边是不是只有一个P元素啊，所以它什么呀，它既是最后一个也是第一个啊，也是第一个叫做一个，诶，自元素好，First child last child，咱们来写一下吧，叫做一个last child。

哎，可以什么呢？可以哎选中我们第一，诶叫什么呀？最后一个子元素啊，最后一个子元素还有一个，还有一个比较有意思的，一个叫做P冒号，一个叫做一个n th child啊n th child的这东西有点比较有意思，NTH什么意思呀？诶第几个，比如说我们英语里边表示第一是不是1TH啊哎，First是不是一第一表示啊表示第一，所以TH表示什么呀？第N个啊表示DN个，所以n th child呢表示什么呢？哎，N child，诶也不要忘了，也是有一个什么呀，冒号可以什么呢？诶可以选中我们这个任意位置的什么呀元素，那比如说那这块我来一个background color，那问题就来了，那你这个选择的是第一个，是第二个还是第三个呀，说不知道啊，哎，我后边可以加一什么呢？加一个括号，括号里边写一个一比示什么呀，选中第一个子元素怎么来。

开效果一刷新走，你是不是第一个变了呀，所以我这括号里写一跟什么呀，跟我们的这个first叉L的效果一样，它的好处是什么呀？它比较自由，我要想选第三个写谁呀？写三易保存易刷新，是不是第三个变了呀？诶n th child啊可以选中我们这个指定位置这个什么呀，元素啊，想选几就写几啊想选几就写几，好那这个里边呢，还有一个特殊用法啊，我们来说一下叫做什么呢？诶该选择器后边可以什么呢？可以指定一个什么呀，相当于一个一个参数，诶指定什么呀，指定要选中第几个什么呀？诶第几个这个子元素啊，第几个子元素，那这里边还可以传一个特殊的值，比如说传什么呢？传一个这个EV啊even我们来看什么效果啊，现在我这一刷新走你，诶发现什么了，是不是两个都变了呀？哎，两个都变了，那一文表示什么意思啊，哎，偶数，那我们来看这是第一个，这是第二个这是第三个这是。

是第四个呀，所以我even表示什么呀？表示偶数第二个第四个是不是变了呀，来那你看着我再写一个，你说这哥们变不变是不是不变呀？哎，它是第五个，来我再写一个保存是不是变了呀，哎，变了啊，所以even表示什么呢？偶数even表示我们这个偶数，诶位置的这什么呀的元素，还有一个叫什么呢？叫做一个ODD啊ODD跟even正好相反，一刷新走，你是不是135啊，诶135ODD表示什么呀？表示这个基数，表示我们这个呃基数。哎，位知的这个什么呀，子元素啊，奇数的这个子元素两个东西，偶数还有一个奇数，这东西有啥用啊？哎，经常我们看到一些做表格的一个什么呀，叫做隔行变色啊，一行一个颜色，一行一个颜色，就可以用什么用我们这个ODD或者这个even来实现了啊，Even表示偶数，ODD表示奇数，那怎么记呢？一问偶数几个字母啊，四个字母诶四个字母四是不是偶数啊，所以一问什么呀？偶数位置ODD表示什么呀？奇数位置它几个字母啊，三个三是不是奇数啊？哎，所以ODD表示的是一个奇数啊，奇数还有这个偶数啊好，这是我们说的这个n th child的啊三个可以找到指定位置的一个子元素，那好，那接下来我们再看啊，除了这三个，还有三个，这三个和他们比较像，有一个叫什么呢？叫做first of type last of type，还有一个什么呀，N th of type，我们来看他们什么区别呀，我还是来一个P冒号，一个first child first child。

一个背景颜色，这是什么呀？是不是第一个子元素P呀？诶是不是第一个就变了呀，保存我们看效果一刷新第一个变了对吧？好，那现在看着我在前面加一个什么呀，SPA，诶我是SPA保存那们来看效果一刷新走，你是不是不变了呀，为什么呀，因为有了SPA以后，SPA是第一个，他不是第一个了吧？诶这是我们说first差的一个问题，那换者换一个，换一个谁呢？First of type啊first of type，我这一保存咱们来看一刷新走你干嘛了，是不是变了呀？诶但是它它是不是第一个呀，不是第一个，为什么他变了呀？诶它是什么呀？它是所有P元素里边的什么呀，第一个了，哎，所有P元素里边第一个，所以这里边我们来说first of type还有什么呀，还有一个叫做last of type。

还有一个什么呢？还有一个叫做n th of。他们这三个呀，和我们这个哎，Fair first of first child，诶，First child这一系列其实什么呀，这一些非常的什么呀，非常的类似啊，非常类似，只不过什么呢？诶只不过我们的这个child啊，我就拿这个child代替了，我你我一说child，你知道我说的是n th h child last child，还有这个什么呀，First这一组child是在什么呢？是在我们这个所有的什么呀，子元素中排，哎子元素中排列，所以这里边注意我一找first child它一定是什么呀，所有的子元素里边什么呀，第一个啊，所有的子元素里边第一个啊，而什么呢，而我们这个tapb什么呢，是在我们这个当前类型的这个元素中干嘛呀排列啊，当前类型的子元素中排列，那所以我这来一个P冒号first of time表道什么意思，找到。

我这个所有子元素里边的什么呀，第一个P，而这个P前面有一堆我都不管，只要它在P里边是什么呀，是第一个就行啊，P里边是第一个就行，那同理，我这如果来个什么呢？来一个last of type，他找的什么呀，找的是最后一个P元素，假如说我最后一是一个span，他管不管哎不管他一样会找到什么呀，最后一个P元素，所以他们的区别就是什么呀，Child是什么呀，是大排行在所有的子元素里排，而我们这个type什么呀，小排行在什么呀，在当前类型里边去排，就像什么呀，像过去以前这个人家可能孩子比较比较多，这一家可能有七个孩子，七个孩子可能有有三个男的，有四个女的是吧呀，那可能我这一排老大老二老三一是不是一直到老七啊，但是我们还会干嘛呀？小排我的大儿子，我的二儿子，我的大闺女，我的二闺女，我要这么排吧，哎，我们这个差子叫什么呀？大牌所有人一块排，而我们这个ta干嘛呀？小排那什么呀，在我这个同一类。

平子里边排啊，First of type找什么呀？找第一个P元素，Last of type找什么呀？找最后一个P元素，而n th of type呢，是不是一样了，找指定的那个P元素，剩下的用法呢，都一样，只不过他们的什么呀？排序方式不同啊，排序方式不同，好，这里边我们又说了几个子元素的那么一个选择器啊，Last first child last child nth child，还有一个first of last of ta，还有一个nth of ta啊这都是一些这个尾类啊，尾类我们来填一下咱们。