a标签的伪元素的应用——link，hover，visited，active
a标签应用中，一般有四个状态：
鼠标未移入前（link），鼠标移入时（hover），
鼠标点击时（active），鼠标点击后（visited）。
<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<style type="text/css">
body{
padding: 200px 0;
}
a {
font-size: 50px;
} /*未访问时*/
a:link {
color: green;
} /*已访问后*/
a:visited {
color: blue;
} /*鼠标浮上*/
a:hover {
color: red;
} /*正在点击*/
a:active {
color: yellow;
}
</style>
</head> <body>
<a href="https://www.baidu.com">aaa</a><br />
<a href="http://www.shenchang.com">wode</a><br />
<a href="https://www.qq.com">QQ</a><br />
<a href="https://www.qq.com">weixin</a>
</body> </html>
a标签的伪元素的应用——link，hover，visited，active的更多相关文章
- 转载利用伪元素单个颜色实现 hover 和 active 时的明暗变化效果
1.颜色小tip知识 在背景色上方叠加一个黑色半透明层 rgba(0,0,0,.2) 可以得到一个更暗的颜色 在背景色上方叠加一个白色半透明层 rgba(255,255,255,.2) 可以得到一个更 ...
- css 伪类: 1)a:link , a:visited, a:hover, a:active 2):first-child
1. 链接伪类: <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset=&qu ...
- 转载 【CSS进阶】伪元素的妙用--单标签之美
1.单个颜色实现按钮 hover .active 的明暗变化 请点击 转载利用伪元素单个颜色实现 hover 和 active 时的明暗变化效果 2.利用after伪类清除浮动 .clearfix:a ...
- 【CSS进阶】伪元素的妙用--单标签之美
最近在研读 <CSS SECRET>(CSS揭秘)这本大作,对 CSS 有了更深层次的理解,折腾了下面这个项目: CSS3奇思妙想 -- Demo (请用 Chrome 浏览器打开,非常值 ...
- 关于css中伪类及伪元素的总结
css中的伪类和伪元素总是混淆,今天参考了很多资料,也查看了部分文档,现将伪类及伪元素总结如下: 一.由来: 伪类和伪元素的引入都是因为在文档树里有些信息无法被充分描述,比如CSS没有"段落 ...
- 前端笔记之HTML5&CSS3（中）选择器&伪类伪元素&CSS3效果&渐变背景&过渡
一.CSS3选择器 CSS3是CSS的第三代版本,新增了很多功能,例如:强大的选择器.盒模型.圆角.渐变.动画.2D/3D转换.文字特效等. CSS3和HTML5没有任何关系!HTML5骨架中,可以用 ...
- 常用伪元素及content属性值的使用
1.常用伪元素有 after.before,使用方法,如下 a:after{ display:block; content:''; } 2. content: "/\00a0";/ ...
- css伪选择器使用总结——css中关于伪类和伪元素的知识总汇
CSS 伪类用于向某些选择器添加特殊的效果,而CSS引入伪类和伪元素的概念是为了实现基于文档树之外的信息的格式化.这里讲总结关于css伪类和伪元素的相关使用 伪元素 :before/:before 在 ...
- 【CSS进阶】伪元素的妙用2 - 多列均匀布局及title属性效果
最近无论是工作还是自我学习提升都很忙,面对长篇大论的博文总是心有余而力不足,但又不断的接触学习到零碎的但是很有意义的知识点,很想分享给大家,所以本篇可能会很短. 本篇接我另一篇讲述 CSS 伪元素的文 ...
随机推荐
- JS高级代码
JS 的defineProperties 设置多个属性 var book = {}; //用Object.defineProperties()方法设置多个属性 Object.definePropert ...
- bzoj:3616: War
Description 小x所在的世界正在经历一场在k个阵营之间的战争.每个阵营有若干个炮塔,每个炮塔由攻击系统和防御系统组成.第i个炮塔可以攻击到离它欧几里德距离小于等于ri 或者曼哈顿距离小于等于 ...
- A. Vasya and Football
A. Vasya and Football time limit per test 2 seconds memory limit per test 256 megabytes input standa ...
- 关于WPF添加右击ContextMeun,以及获取所绑定控件的源
今天在公司给公司做一个门禁软件,其中有一个添加员工的功能,功能已经做好,但是页面的右边是一个treeView控件,于是我想到再添加员工后,可以在treeview上的部门的TreeViewWithIco ...
- c++(选择排序)
选择排序是和冒泡排序差不多的一种排序.和冒泡排序交换相连数据不一样的是,选择排序只有在确定了最小的数据之后,才会发生交换.怎么交换呢?我们可以以下面一组数据作为测试: 2, 1, 5, 4, 9 第一 ...
- java中static关键字的继承问题
结论:java中静态属性和静态方法可以被继承,但是没有被重写(overwrite)而是被隐藏. 原因: 1). 静态方法和属性是属于类的,调用的时候直接通过类名.方法名完成对,不需要继承机制及可以调用 ...
- 淘淘商城学习笔记 之 上传图片到远程服务器，图片的回显出现的bug
最近在学习淘淘商城中用到的技术,感觉受益良多,遇到一个比较奇怪的bug调了好久,遂心乐之分享于诸君 bug情况是这样的:在商城的后台上传图片之后图片回显不出来,右键查看链接,发现链接被加了localh ...
- 设置某个类使用或者禁用ARC
设置这个类为ARC的 用:-fobjc-arc 设置这个类非ARC的:-fno-objc-arc 工程是非ARC的,但是引用的第三方类库是ARC的,所以要使用的时候,要单独设置这个第三方的类是A ...
- Java Reflection(getXXX和getDeclaredXXX)
package com.sunchao.reflection; public class Person { private int age ; private String name; public ...
- 注入理解之APC注入
近期学习做了一个各种注入的MFC程序,把一些心得和体会每天分享一些 APC(Asynchronous procedure call)异步程序调用,在NT中,有两种类型的APCs:用户模式和内核模式.用 ...