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系列教程:背景图片(背景大小和多背景图) 应用说明
Dec 19 HTML / CSS
css3.0 图形构成实例练习一
Mar 19 HTML / CSS
css3让div随鼠标移动而抖动起来
Feb 10 HTML / CSS
魔幻般冒泡背景的CSS3按钮动画
Feb 27 HTML / CSS
HTML5 本地存储 LocalStorage详解
Jun 24 HTML / CSS
基于HTML5 Canvas 实现商场监控实例详解
Nov 20 HTML / CSS
HTML5新增的Css选择器、伪类介绍
Aug 07 HTML / CSS
移动HTML5前端框架—MUI的使用
Dec 18 HTML / CSS
html5 http的轮询和Websocket原理
Oct 19 HTML / CSS
详解使用双缓存解决Canvas clearRect引起的闪屏问题
Apr 29 HTML / CSS
HTML5 新增内容和 API详解
Nov 17 HTML / CSS
聊聊CSS粘性定位sticky案例解析
Jun 01 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 mysql数据库操作分页类
2008/06/04 PHP
用php实现百度网盘图片直链的代码分享
2012/11/01 PHP
PHP对MongoDB[NoSQL]数据库的操作
2013/03/01 PHP
深入PHP数据缓存的使用说明
2013/05/10 PHP
奉献出一个封装的curl函数 便于调用(抓数据专用)
2013/07/22 PHP
PHP通过内置函数memory_get_usage()获取内存使用情况
2014/11/20 PHP
phpMyAdmin安装并配置允许空密码登录
2015/07/04 PHP
PHP版微信第三方实现一键登录及获取用户信息的方法
2016/10/14 PHP
利用PHP扩展Xhprof分析项目性能实践教程
2018/09/05 PHP
Javascript在IE或Firefox下获取鼠标位置的代码
2009/12/18 Javascript
Js制作简单弹出层DIV在页面居中 中间显示遮罩的具体方法
2013/08/08 Javascript
JavaScript中通过prototype属性共享属性和方法的技巧实例
2015/03/13 Javascript
初识Javascript小结
2015/07/16 Javascript
javascript HTML5 Canvas实现圆盘抽奖功能
2016/04/11 Javascript
webix+springmvc session超时跳转登录页面
2016/10/30 Javascript
详解Javascript几种跨域方式总结
2017/02/27 Javascript
JavaScript实现各种排序的代码详解
2017/08/28 Javascript
使用Vue组件实现一个简单弹窗效果
2018/04/23 Javascript
详解vue文件中使用echarts.js的两种方式
2018/10/18 Javascript
jQuery each和js forEach用法比较
2019/02/27 jQuery
layui table数据修改的回显方法
2019/09/04 Javascript
基于JavaScript伪随机正态分布代码实例
2019/11/07 Javascript
js实现蒙版效果
2020/01/11 Javascript
详解Python数据分析--Pandas知识点
2019/03/23 Python
Python PyCharm如何进行断点调试
2019/07/05 Python
Python 远程开关机的方法
2020/11/18 Python
解决python3.6用cx_Oracle库连接Oracle的问题
2020/12/07 Python
html5 冒号分隔符对齐的实现
2019/07/31 HTML / CSS
奥地利顶级内衣丝袜品牌英国站:Wolford英国
2016/08/29 全球购物
VICHY薇姿美国官方网站:欧洲药房第一的抗衰老品牌
2017/11/22 全球购物
外联部演讲稿
2014/05/24 职场文书
2014领导班子“四风问题”对照检查材料思想汇报(执法局)
2014/09/21 职场文书
毕业实习指导教师评语
2014/12/31 职场文书
社区党务工作总结2015
2015/05/19 职场文书
「约定的梦幻岛」作画发布诺曼生日新绘
2022/03/21 日漫
微信小程序调用python模型
2022/04/21 Python