css 伪类: 1)a:link , a:visited, a:hover, a:active 2):first-child
1. 链接伪类:
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>伪类</title>
<style type="text/css">
a:link {color: #FF0000} /* 未访问的链接 */
a:visited {color: #00FF00} /* 已访问的链接 */
a:hover {color: #FF00FF} /* 鼠标移动到链接上 */
a:active {color: #0000FF} /* 选定的链接 */
</style>
</head>
<body> <h2>链接伪类</h2>
<a href="#">伪类链接</a> </body>
</html>
a:link 未访问
a:hover: 鼠标放上.
2.CSS2 - :first-child 伪类
例如: p:first-child 这个表示的是 p 的父元素 的 第一个子元素是 p ; 如果存在就应用样式, 如果不存在就没有样式.
p:first-child 匹配到:
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>伪类</title>
<style type="text/css">
p:first-child {
color: red;
}
</style>
</head>
<body> <h2>:first-child类</h2>
<div>
<p>这是p1</p>
<div>这是div</div>
<p>这是p2</p> </div> </body>
</html>
p:first-child 没有匹配到:
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>伪类</title>
<style type="text/css">
p:first-child {
color: red;
}
</style>
</head>
<body> <h2>:first-child类</h2>
<div>
<div>这是div</div>
<p>这是p1</p>
<p>这是p2</p> </div> </body>
</html>
这是因为 p 元素的 父元素 div 的第一个子元素 是 子 div , 不是 p 元素, 没有匹配到.
-----------------------
参考资料:
css 伪类: 1)a:link , a:visited, a:hover, a:active 2):first-child的更多相关文章
- CSS链接的样式a:link,a:visited,a:hover,a:active
a :link(未被访问)a:hover(鼠标悬停)a:visited(访问过:真正到达那个页面)a:active(鼠标点击与释放之间.对无href属性的a对象无作用) 这几个元素,定义CSS时候的顺 ...
- css中链接的4个状态 link、visited 、hover、active 顺序与设置
link 未点时链接色visited 已点过的链接色hover 光标放入链接上的色active 点击时的样式 顺序一定要按link.visited.hover.active来设置 ...
- a:link,a:visited,a:hover,a:active
1:解释 link:连接平常的状态 visited:连接被访问过之后 hover:鼠标放到连接上的时候 active:连接被按下的时候 详细的: :hover版本:CSS1/CSS2 兼容性 ...
- a标签的link、visited、hover、active的顺序
a标签的link.visited.hover.active是有一定顺序的,以下是我一直在用的一个顺序,能正确显示四个颜色,我也不知道有没有其他的顺序能正确显示,如果你没办法判断哪个是对的,那就先用这个 ...
- 如何消除移动端a标签点击时的蓝色底色以及a标签link、visited、hover、active的顺序
1.消除a标签移动端点击时的蓝色底色 -webkit-tap-highlight-color:transparent 2.link.visited.hover.active的顺序 a:link{tex ...
- a:link a:visited a:hover a:active四种伪类选择器的区别
a:link选择网页中所有没有被visited的a标签,就是没有鼠标悬停hover或者点击click(a链接没有被访问时的样式) a:visited选择网页中所有已经被click的a链接,用来告诉用户 ...
- 超链接标签的CSS伪类link,visited,hover,active
CSS伪类,是一种特殊的类,它针对到CSS选择器起作用,使选中的标签或元素产生特定的效果. CSS伪类的语法就是: 选择器 : 伪类名 { 属性 : 属性值 } 用的最多的伪类就是超链接a的伪类,有: ...
- CSS伪类和伪元素
一.伪类 CSS伪类用于向某些选择器添加特殊的效果,在W3规范中,CSS伪类有如下几个: CSS2.1 :active:向被激活的元素添加样式(激活是指点击鼠标那一下) :focus:向拥有键盘输入焦 ...
- CSS 伪类
Link The :link CSS pseudo-class lets you select links inside elements. This will select any link whi ...
随机推荐
- 20165309 实验四 Android程序设计
2017-2018-2 20165309实验四<Java面向对象程序设计>实验报告 一.实验内容 1.Android Studio的安装测试 2.Activity测试 3.UI测试 4.布 ...
- GIL(全局解释器锁)与互斥锁
针对Cpython所拥有的GIL锁作用:由于Cpython解释器在运行python文件时, Cpython进程与其运行文件所产生的主进程是一个进程(文件进程相当于Cpython的一个线程) 线程的特点 ...
- java进行url编码和解码
public static String getURLEncoderString(String str) { String result = ""; if (null == str ...
- WDA基础十四：ALV字段属性配置表
ALV配置表管理 一．字段属性配置表 对于可编辑的ALV不用这个,尽可能多的设置一些控制: 单元格类型:默认A,特殊选择 ZLYE_TYPE E A 1 ...
- 通过cassandra-cli客户端了解cassandra的内部数据结构
和cassandra数据库交互的方式有两种,一种是通过类似于cassandra-cli命令的thrift api,或者通过cassandra提供的cql(cassandra query lanugag ...
- lombok @EqualsAndHashCode 注解的影响
官方文档:@EqualsAndHashCode 原文中提到的大致有以下几点: 1. 此注解会生成equals(Object other) 和 hashCode()方法. 2. 它默认使用非静态,非瞬态 ...
- 二十一、MVC的WEB框架（Spring MVC）
一.基于注解方式配置 1.首先是修改IndexContoller控制器类 1.1.在类前面加上@Controller:表示这个类是一个控制器 1.2.在方法handleRequest前面加上@Requ ...
- Java中关键字this、super的含义及使用
Java语言中this的含义及作用: 关键字this用来指向当前实例对象(内存里正在运行的哪个实例对象),它的另一作用是用来区分对象的成员变量与方法的形参. 关键字super指的是当前对象里边的父对象 ...
- 如何仅用递归函数和栈操作逆序一个栈——你要先用stack实现，再去改成递归——需要对递归理解很深刻才能写出来
/** * 如何仅用递归函数和栈操作逆序一个栈 * 题目: * 一个栈依次压入1,2,3,4,5,那么从栈顶到栈底分别为5,4,3,2,1. * 将这个栈转置后,从栈顶到栈底为1,2,3,4,5,也就 ...
- Let's Encrypt 免费通配符 SSL 证书申请教程——但是也需要email，域名所有权等，如果是黑产用的话会这样用吗？会不会暴露自己身份？？？
Let's Encrypt 免费通配符 SSL 证书申请教程 from:https://blog.csdn.net/English0523/article/details/79608464 2018 ...