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 ...
随机推荐
- GIL锁,线程池
内容梗概: 1.线程队列 2.线程池 3.GIL锁 1.线程队列 1.1先进先出队列(FIFO)import queueq = queue.Queue(3)q.put(1)q.put(2)q.put( ...
- java 字符串截取的几种方式(转）
众所周知,java提供了很多字符串截取的方式.下面就来看看大致有几种. 1.split()+正则表达式来进行截取. 将正则传入split().返回的是一个字符串数组类型.不过通过这种方式截取会有很大的 ...
- Seagull License Server 9.4 SR3 2781 完美激活(解决不能打印问题)
BarTender 9.4 SR3完美激活方法 网上下载的BarTender 9.4大部分不能正常打印,已经测试过了,完美解决无法打印,界面停留在“无法打印,出现正在试图连接到seagull lice ...
- 『计算机视觉』Mask-RCNN_推断网络其四：FPN和ROIAlign的耦合
一.模块概述 上节的最后,我们进行了如下操作获取了有限的proposal, # [IMAGES_PER_GPU, num_rois, (y1, x1, y2, x2)] # IMAGES_PER_GP ...
- 第二阶段——个人工作总结DAY10
1.昨天做了什么:昨天其实什么也没实现. 2.今天打算做什么:今天就软件,等到审核过了,再看看软件最后后台是怎么实现的. 3.遇到的困难:后台自己都没有实现.
- HDU-2874-森林求LCA/tarjan
http://acm.hdu.edu.cn/showproblem.php?pid=2874 给出一个森林,询问任意两点最短距离. tarjan跑一遍即可,就是这个题卡内存,vector会MLE,换前 ...
- PAT 1003 Emergency
1003 Emergency (25 分) As an emergency rescue team leader of a city, you are given a special map of ...
- ALV打印模板（存代码）
*&---------------------------------------------------------------------* *& Report ZMMF013 * ...
- Notes for 'Making elephants fly'
1. 技术陷阱:应是需求导向, 而不是技术导向. 2. 时机最重要:而不是创造力,团队,客户,产品,或技术. 3. 模仿:能模仿就模仿,不能模仿就创新.巧匠摹形,大师窃意. good artists ...
- Windows定位窗口对应的exe文件
一.说明 以下两种情况我们会想要定位窗口是由哪个exe文件,或者什么命令启用 第一种是:广告窗口,现在经常时不时冒出一个广告窗口,要么是完全看不出哪个程序启动,要么是虽然大概知道是哪个应用启动(比如w ...