a标签的css样式四个状态


Posted in HTML / CSS onMarch 09, 2021

a标签有四个“状态”的先后过程是:a:link ->a:hover ->a:active ->a:visited。

表示所有状态下的连接 如 a{color:red}

  • a:link:未访问链接 ,如 a:link {color:blue}
  • a:visited:已访问链接 ,如 a:visited{color:blue}
  • a:active:激活时(链接获得焦点时)链接的颜色 ,如a:active{color:blue}
  • a:hover:鼠标移到链接上时 ,如 a:hover {color:blue}

一般a:hover和a:visited链接的状态(颜色、下划线等)应该是相同的。

前三者分别对应body元素的link、vlink、alink这三个属性。

举例:伪类的常见状态值

<style type="text/css"> 
a {
	font-size: 16px
}
a:link {
	color: blue;
	text-decoration: none;
} //未访问:蓝色、无下划线 
a:active: {
	color: red;
} //激活:红色 
a:visited {
	color: purple;
	text-decoration: none;
} //已访问:purple、无下划线 
a:hover {
	color: red;
	text-decoration: underline;
} //鼠标移近:红色、下划线 
</style> 

 

HTML / CSS 相关文章推荐
利用CSS3实现动态的二级三级菜单效果实例源码
Jan 04 HTML / CSS
css3实现一款模仿iphone样式的注册表单
Mar 20 HTML / CSS
CSS3使用transition属性实现过渡效果
Apr 18 HTML / CSS
Html5大文件断点续传实现方法
Dec 05 HTML / CSS
整理HTML5移动端开发的常用触摸事件
Apr 15 HTML / CSS
HTML5新增加标签和功能概述
Sep 05 HTML / CSS
html5实现移动端适配完美写法
Nov 16 HTML / CSS
HTML5的postMessage的使用手册
Dec 19 HTML / CSS
吃透移动端 1px的具体用法
Dec 16 HTML / CSS
html5 canvas手势解锁源码分享
Jan 07 HTML / CSS
使用iframe+postMessage实现页面跨域通信的示例代码
Jan 14 HTML / CSS
CSS几步实现赛博朋克2077风格视觉效果
Jun 16 HTML / CSS
纯CSS3实现质感细腻丝滑按钮
Mar 09 #HTML / CSS
css动画效果之animation的常用样式
Mar 09 #HTML / CSS
使用CSS3实现字体颜色渐变的实现
CSS心形加载的动画源码的实现
CSS中简写属性要注意TRouBLe的顺序问题(避免踩坑)
详解CSS样式中的 !important * _ 符号
CSS中一些@规则的用法小结
Mar 09 #HTML / CSS
You might like
PHP中数字检测is_numeric与ctype_digit的区别介绍
2012/10/04 PHP
PHP实现图片裁剪、添加水印效果代码
2014/10/01 PHP
PHP计算加权平均数的方法
2015/07/16 PHP
PHP实现的日历功能示例
2018/09/01 PHP
PHP学习记录之常用的魔术常量详解
2019/12/12 PHP
UI Events 用户界面事件
2012/06/27 Javascript
jQuery中val()方法用法实例
2014/12/25 Javascript
Easyui Treegrid改变默认图标的方法
2016/04/29 Javascript
js简单实现调整网页字体大小的方法
2016/07/23 Javascript
jquery实现全选、不选、反选的两种方法
2016/09/06 Javascript
JavaScript学习笔记--常用的互动方法
2016/12/07 Javascript
详解angular2实现ng2-router 路由和嵌套路由
2017/03/24 Javascript
详解react-native-fs插件的使用以及遇到的坑
2017/09/12 Javascript
关于Vue的路由权限管理的示例代码
2018/03/06 Javascript
JavaScript生成指定范围的时间列表
2018/03/19 Javascript
基于vue-video-player自定义播放器的方法
2018/03/21 Javascript
NodeJS加密解密及node-rsa加密解密用法详解
2018/10/12 NodeJs
将Python代码嵌入C++程序进行编写的实例
2015/07/31 Python
浅谈Python 中整型对象的存储问题
2016/05/16 Python
python paramiko模块学习分享
2017/08/23 Python
selenium+python实现1688网站验证码图片的截取功能
2018/08/14 Python
对python中xlsx,csv以及json文件的相互转化方法详解
2018/12/25 Python
网易有道2017内推编程题 洗牌(python)
2019/06/19 Python
python pickle存储、读取大数据量列表、字典数据的方法
2019/07/07 Python
sqlalchemy实现时间列自动更新教程
2020/09/02 Python
main 主函数执行完毕后,是否可能会再执行一段代码,给出说明
2012/12/05 面试题
网络信息管理员岗位职责
2014/01/05 职场文书
应届大学生简历中的自我评价
2014/01/15 职场文书
《猴子种果树》教学反思
2014/04/26 职场文书
家长对孩子的寄语
2015/02/26 职场文书
餐饮店长岗位职责
2015/04/14 职场文书
教您怎么制定西餐厅运营方案 ?
2019/07/05 职场文书
Oracle创建只读账号的详细步骤
2021/06/07 Oracle
Java设计模式之享元模式示例详解
2022/03/03 Java/Android
游戏《东方异文石:爱亚利亚黎明》正式版发布
2022/04/03 其他游戏
Java中的Kafka为什么性能这么快及4大核心详析
2022/09/23 Java/Android