00:00
我们来看一下链接伪类选择器,这个呢,还是我们今天的重点部分,也要重点掌握,在讲之前我们先看一下有一个叫做伪类选择器的,那什么叫伪类型的气啊,有同学老师这个跟类型的气有关系吗?哎,你猜对了,确实跟类型的气有关系,那一个点的叫类型的气,你看点单帽是不是叫类型的器啊,而尾类型的器呢,叫两个点,也就我们说的冒号。哎,所以说呢,它呢特别像类型的气,但是不是真正的类型的气,所以叫伪类型的气啊,那你肯定听说过这个词叫做伪娘,你听说过吗?哎,伪娘嘛,就不是真正的娘们对吧?好,那么我们的伪类型的气,也就是说它和类型气很相似,但是不是真正的类型的气,我们称之为伪类,选的器是除了类型的器之外,基于文档上也会有展示效果的,我们称为尾类型的器啊,那你就简单理解,类型的器是一个点,而尾类型的器呢,是用冒号,哎,就两个点来组成的,叫伪类显示器,而那伪类显示器呢,通常呢,可以向我们某些元素添加一些特殊的效果,比如说链接。
01:05
我我们要讲的链接尾的选择器,那比如说你看我鼠标一放上去,诶变色了,这个是咱前面见的最多的一种效果,我们还不会,我们现在就可以来做了,它就属于链接尾类帮助我们去做的,还可以怎么办呢?比如说我有五个div位,我可以把第一个和第三个单独选出来,不用类型的T,用尾类就可以选出来,哎,这个是不是用类型的器比类型的器还要简单一些的,那这是它的一个作用,因为尾类显示器呢,有很多,比如说链接为类啊,结构为类啊等等,有很多很多的,但是呢,咱们现在只教给大家链接为类,好吧,那剩下的那些伪类选择器呢,咱们后面会慢慢来学。那我们先看一下我们链接我件呢,主要有四个啊,分别是a link这个未访问过的链接,A visited,已访问过的链接,Power,鼠标移上去的链接,Active选定的链接,好老师好多呀,四个,哎,其实这四个你基本上都见过啊,什么意思呢?你看刚开始鼠这是一个A吧,它是一个样子,我鼠标放上去,哎,是不是另外发生了另外一种样子,是不是啊,就是原先的链接和鼠标放上去的链接,还有一个同学们有没有注意过,我们有的我们在浏览新闻页面的时候,比如说这篇文章我看过,我点了一下,第二次我打开页面之后发现这个这篇文章我看过,是不是就自己变了一个颜色,表示我已经看过了。
02:20
是不是那个是不是已经访问过的链接啊等等等等之类的,这个呢,就是我们四个的状态,我们非常常见,好了,那么我们给大家来演示一下这四个链接到底是怎么使用的,好在这里面我还是建好了链接为例了,在这里面我们先写第一个,我们比如说我们就叫做什么呢?小米手机写了一个,我要给他添加链接了啊X。注意它的写法啊A,然后呢,井号到这里面去CL加V,写完之后呢,同样道理呢,我在上面呢,书写一下我们的样式。我们是不是有四个呀,还记得吗?第一个呢,叫做A冒号link未访问的链接,好的,我如果未访问过,我就A冒号,然后呢,Link好你在这里面注意一下,看一下啊,你看冒号link就属于尾类显择器,那前面我加了一个A,是不是叫做链接为类了,哎,我们说只要加冒号的都是尾类的啊,那连在一起叫链接伪类,这个呢叫做什么呀?为房子的链接,好,我给它改个颜色,我们为访问问呢,我来一个井号,比如说我来个3331看就是一种黑色啊,这是我们用的16进制来表示的,好,右键在67中打开,我们一看,哦,是不是已经有这个颜色了,黑色了,那要不要下划线呢?不要同学们还记不记得去掉下划线的方法,Test刚decoration no,是不是取消下划线呀,没忘吧,取消下划线就可以了,写完毕之后呢,我可以右键在六人之打开H先停一下,怎么办呢?啊,我一会呢,为了和你做对比啊,我先把井号先改过来看好了,HTTP冒号反斜杠打不打点?
03:50
小米点com,好,那我一会儿呢,要给你做链接做对比,我先给他给了一个网址,我们不用井号啊,写完之后呢,我在右键浏览器中打开,我们可以看,诶这个是不是就链接正常时候的状态了,那有了它之后呢,我想做什么效果呢?哎,我们就看我们的第二个了,那我先给你记录下来啊,这个呢,叫做什么呀,未访问过的,未访问过,哎链接的状态也就我们说是不是叫做正常状态呀,这么给你记下来啊,这是它的,那第二个叫什么呢?我们保存一下来看一看,第二个呢,叫visited已访问过的链接,所谓的访问过是不是就是我们看过一次这个页面对吧?好,第二个呢,就是哎,已经访问过的。
04:33
链接,哎,也就是说我们哎点击过,哎这个呢,就是我们说的叫做已访问的链接状态,它怎么写呢?这么写,A冒号vied visited,那么was这个啊叫访问的加上E表示过去式啊,就是我已经去看过了,怎么办呢?Cor orange or orange。好了,那这样的话,我是不是添加了一个叫orange的一个页面写,呃,一个链接写完之后呢,我们刷新看效果啊,一走你看没有什么变化,那什么叫已访问过的呢?注意看啊,当我把鼠标放在他身上,当我点一次,当我一点小米手机可能去了小米手机的页面了,那个页面我是不是已经看过了,往后退一下啊,以后退完之后你会发现,哦,原来这个链接我点过是不是就变成了一种橙色了,哎,那原先那个颜色你就找不到了啊,找不回来了,因为你已经点过了,也就是说是不是它两个是正好是相反的一对呀啊那就是说你一个链接呢,你要么访问过,要么没访问过,只要你点完之后呢,就变成了这个状态了,你这个状态就不再显示了,因为你已经访问过,我就显示第二个状态了,好吧,这是第二个,好,还有第三个呢,就是我们要做的鼠标移动到链接时的状态,那鼠标移动上去呢,什么意思呢?就是这个呀,你看原先是黑色,我鼠标一放上去变成一种红色就OK了啊,那也就是说呢,我们的第三个那就是鼠标哎。
05:52
鼠标经过链接时候的状态,也就说呢,它会怎么办?鼠标经过链接啊,那这个呢,就是A冒号how,但这个是大家重点记,这个是我们用的最多最多的一个了,这个一定要记住啊,鼠标一放上去怎么办呢?哎,我就可以让它变换一种颜色,比如说color改成一个red红色,好吧,那改完之后呢,我们再刷新看效果走,你看我鼠标一放上去,诶是不是可以变红色就行了,那这个就是我们讲的这种的做法,鼠标放上去可以变成了一种红色啊那讲完这个最后一个呢,还有一个呢,叫什么呢?哎,这可能比较有意思啊,叫做选定的链接状态,选定所谓的选定啊,那选中的状态呢,其实呢,你简单去理解,就说什么意思呢?就是当我们点击的时候,但是呢,这个点击有个要求啊,按下鼠标别松开的时候听到了吗?哎,这个当然我们用的比较少而已,那这个点击怎么写呢?就是A冒号active act active就行了,这个点击那Co color,那我改成一个。
06:52
Green green green green green就行了,当我们点击完之后呢,变成了一种蓝色,好,我选完之后我刷新一遍,注意看啊,鼠标一放上去是叫好的状态,当我按着鼠标别松开,一按下是不是一种绿色了,哎,别松开的时候呢,是绿色啊,松开手之后,那就还是这个样子。
07:10
好了,这个呢,是给大家讲到我们链接有四个状态,这个Ali和wied呢,它俩属于一个相对的,所以只能看到一个状态,刚才我说了,我们做的这个页面是不是可让你做对比的,你看我在CTRLCCTRL为复制一份,这个呢不叫小米手机,哎,这个呢,哎,比如说我叫做大米手机,对吧,好大米,那大米什么手机呢?在这里面呢,不就就不叫小米了,而叫做大米点com,好,那我改完之后呢,同学们给我来想一想这个链接刚才我是不是已经点过了,这个链接我有没有点过呢?没有,对不对啊,所以说呢,我保存一下之后,你再给我们来刷新看效果走,你会发现大米手机是默认的是黑色,鼠标放上去是红色,而小米手机呢,因为已经点过一次了,所以它展示出展示出来的效果呢,就是一个我们要的一个orange的颜色,那最后呢,我们再走简单的给大家串一串,我们的链接是不是一共有四个状态呀,分别是link,就是说是没有访问过的链接,Visited已经访问过的,他俩呢,只能展示其中一个,还有呢,我们用的最多最多这个重点去记忆的叫how a冒号。
08:11
二的意思就说是鼠标经过链接的时候呢,它会自动变成颜色,那最后一个呢,我们用的最少的就是点击的时候变色,这个呢,我们很少去见啊,这是我们讲的链接的四个状态。
我来说两句