类选择器和伪类选择器区别

  类选择器我们可以随意起名,而伪类选择器是CSS中已经定义好的选择器,不可以随意起名。

  

伪类选择器以及伪元素

  我们把它放到这里

  p.aaas{

  text-align: left;

  color: red;

  }

它同样的会被选择

  最常见的伪类选择器

  未被访问的链接

  a:link{ color: #ff6600 } /* 未被访问的链接 */

  我们来测试一下,我们给它添加一个超链接。

  伪类选择器

  我们给这个伪类选择器,选定样式,第一种

  a:link{

  color: #000;

  }

  link它是表示的未被访问的链接

  已被访问的链接

  a:visited{

  color: fuchsia;

  }

  然后是我们鼠标放上去的,一个颜色。

  a:hover{

  color :green;

  }

  当我们鼠标放上去的时候变成绿色。还有一个是当我们鼠标,正在被点击的时候。

  a:active{

  color: #ff6600;

  }

  就会显示橙色,这样就定义了一个伪类,当我们这个链接还没有访问的时候它就是黑色,当我们这个链接已经访问过后,在返回这个页面的时候呢,这个链接的颜色呢就会变成紫色,当我们鼠标经过它的时候呢,它就会变成绿色,当我们点击的时候,就是我们鼠标左键点下去,但并没有弹回来的时候呢它就会变成橙色。好那么我们来看一下效果。

  现在是这样的一个颜色,是紫色。紫色就表示我们已经访问过了。因为我们现在正在返回这个页面,那么在这里我们可以来更改一下,改成index1。

  伪类选择器

  因为index1不存在所以就不会存在被访问了。

 那么在没有访问是之前呢是黑色link,当我们的这个鼠标移动上去的话

会变成绿色,当我们鼠标点击下去但是并没有松开,会变成

橙色。当我们松开之后呢它会访问,访问之后它就会变成紫色。我们新建一个页面index1,那这样单击之后再返回的时候就变成紫色的了。这就是伪类。

原文链接:http://www.maiziedu.com/wiki/css3/selector/

CSS3中的伪类选择器详解的更多相关文章

  1. CSS3 结构伪类选择器 详解

    1 CSS3 结构伪类选择器 1.E:root 匹配E元素所在的根元素 即:html 2. E:nth-child(n) (1)匹配E元素的父元素中第n个子元素,(2)且该位置的子元素类型必须是E类型 ...

  2. css3 伪元素和伪类选择器详解

    转自脚本之家:http://www.jb51.net/css/213779.html 无论是伪类还是伪元素,都属于CSS选择器的范畴.所以它们的定义可以在CSS标准的选择器章节找到.分别是 CSS2. ...

  3. css3中的伪类选择器

    一.动态伪类 动态伪类,因为这些伪类并不存在于HTML中,而只有当用户和网站交互的时候才能体现出来,动态伪类包含两种,第一种是我们在链接中常看到的锚点伪类,如":link",&qu ...

  4. CSS3中结构伪类选择器——root、not、empty、target选择器

    1.root选择器 将样式绑定到页面的根元素中.根元素是指位于文档树中最顶层结构的元素,在HTML页面中就是指包含整个页面的<html>部分. <style type="t ...

  5. CSS3中only-child伪类选择器

    <body> <style type="text/css"> //只对li1设置样式 li:nth-child(1):nth-last-child(1){ ...

  6. CSS3的一个伪类选择器:nth-child()

    CSS3的一个伪类选择器“:nth-child()”. Table表格奇偶数行定义样式: 语法: :nth-child(an+b) 为什么选择她,因为我认为,这个选择器是最多学问的一个了.很可惜,据我 ...

  7. Delphi中的线程类 - TThread详解

    Delphi中的线程类 - TThread详解 2011年06月27日 星期一 20:28 Delphi中有一个线程类TThread是用来实现多线程编程的,这个绝大多数Delphi书藉都有说到,但基本 ...

  8. MFC中文件对话框类CFileDialog详解及文件过滤器说明

    当前位置 : 首页 » 文章分类 :  开发  »  MFC中文件对话框类CFileDialog详解及文件过滤器说明 上一篇 利用OpenCV从摄像头获得图像的坐标原点是在左下角 下一篇 Word中为 ...

  9. 【CSS3】---结构性伪类选择器—nth-child(n)+nth-last-child(n)

    结构性伪类选择器—nth-child(n) “:nth-child(n)”选择器用来定位某个父元素的一个或多个特定的子元素.其中“n”是其参数,而且可以是整数值(1,2,3,4),也可以是表达式(2n ...

随机推荐

  1. docker 介绍

    docker 介绍 安装 sudo apt-get install docker.io sudo docker info 查看是否安装成功 hello world sodu docker run he ...

  2. mbed学习之Digital IO (一)

    mbed的IO操作非常灵活,常见的关于Digital IO操作整理如下表 ,其中蓝色字体是构造函数,绿色字体的是操作符重载,使用时只要创建对象,就可以调用对应的方法来操作,并且每种都提供了操作符重载, ...

  3. Jquery remove 高级用法

    Jquery remove 高级用法 html 代码 <div class="file-image">abc1111</div><div class= ...

  4. MD5 Checksums for R12.1.1 Rapid Install Media (文档 ID 802195.1)

    Oracle EBusiness Suite R12.1.x Rapid Installmd5 Checksums November 2011 Section      1: Overview Sec ...

  5. STM32的USART中断死循环,形成死机。

    作者:观海  QQ:531622 直接说重点:我用的是 STM32F103 芯片 USART2_IRQHandler 总是中断,程序死循环. 1.出现问题: 原程序的中断处理程序是: void USA ...

  6. 三分钟学会funsioncharts

    由于项目需求需要做一个报表,选择FusionCharts作为工具使用.由于以前没有接触过报表,网上也没有比较详细的fusionCharts教程,所以决定好好研究FusionCharts,同时做一个比较 ...

  7. php中echo(),print(),print_r()之间的区别

    echo是PHP语句, print和print_r是函数,语句没有返回值,函数可以有返回值(即便没有用)  print只能打印出简单类型变量的值(如int,string)  print_r可以打印出复 ...

  8. 用kryonet时kryo报buffer underflow错误

    原因是客户端和服务器端的kryo必须register同样的class类,某一端多register一个class类导致的

  9. 外国javascript资源搜索

    https://www.javascripting.com/search?q=canvas

  10. break continue return

    break 通常用在循环语句和开关语句中,当break语句用于do-while.for.while循环语句中时,可使程序终止循环而执行循环后面的语句, 通常break语句总是与if语句联在一起,即满足 ...