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 相关文章推荐
常用的四种CSS透明属性介绍
Apr 12 HTML / CSS
css3设置box-pack和box-align让div里面的元素垂直居中
Sep 01 HTML / CSS
一款利用css3的鼠标经过动画显示详情特效的实例教程
Dec 29 HTML / CSS
浅析rem和em和px vh vw和% 移动端长度单位
Apr 28 HTML / CSS
基于ccs3的timeline时间线实现方法
Apr 30 HTML / CSS
关于css中margin的值和垂直外边距重叠问题
Oct 27 HTML / CSS
html5组织文档结构_动力节点Java学院整理
Jul 11 HTML / CSS
HTML5之HTML元素扩展(上)—新增加的元素及使用概述
Jan 31 HTML / CSS
HTML5注册页面示例代码
Mar 27 HTML / CSS
HTML5+CSS3绘制锯齿状的矩形
Mar 01 HTML / CSS
html5 移动端视频video的android兼容(去除播放控件、全屏)
Mar 26 HTML / CSS
Canvas获取视频第一帧缩略图的实现
Nov 11 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
[FAQ]PHP中的一些常识:类篇
2006/10/09 PHP
亲密接触PHP之PHP语法学习笔记1
2006/12/17 PHP
PHP setcookie() cannot modify header information 的解决方法
2009/01/09 PHP
php 伪造本地文件包含漏洞的代码
2011/11/03 PHP
shell脚本作为保证PHP脚本不挂掉的守护进程实例分享
2013/07/15 PHP
javascript 当前日期加(天、周、月、年)
2009/08/09 Javascript
javascript 最常用的10个自定义函数[推荐]
2009/12/26 Javascript
jQuery使用$.get()方法从服务器文件载入数据实例
2015/03/25 Javascript
js实现不重复导入的方法
2016/03/02 Javascript
web 前端常用组件之Layer弹出层组件
2016/09/22 Javascript
JS正则获取HTML元素的方法
2017/03/31 Javascript
简单的vuex 的使用案例笔记
2018/04/13 Javascript
vue2中引用及使用 better-scroll的方法详解
2018/11/15 Javascript
Element input树型下拉框的实现代码
2018/12/21 Javascript
vue实现在线翻译功能
2019/09/27 Javascript
vue3.0 上手体验
2020/09/21 Javascript
[02:56]DOTA2矮人直升机 英雄基础教程
2013/11/26 DOTA
Python写的贪吃蛇游戏例子
2014/06/16 Python
Python中使用插入排序算法的简单分析与代码示例
2016/05/04 Python
TensorFlow高效读取数据的方法示例
2018/02/06 Python
使用Python进行中文繁简转换的实现代码
2019/10/18 Python
基于python操作ES实例详解
2019/11/16 Python
基于python plotly交互式图表大全
2019/12/07 Python
简单了解Django项目应用创建过程
2020/07/06 Python
H5 meta小结(前端必看篇)
2016/08/24 HTML / CSS
Bitiba意大利:在线宠物商店
2020/10/31 全球购物
PHP如何对用户密码进行加密
2014/07/31 面试题
仪器仪表检测毕业生自荐信
2013/10/31 职场文书
班级入场式解说词
2014/02/01 职场文书
大学生通用个人的自我评价
2014/02/10 职场文书
银行竞聘演讲稿范文
2014/04/23 职场文书
三严三实·严以律己心得体会
2016/01/13 职场文书
2016思想纪律作风整顿心得体会
2016/01/23 职场文书
街道办残联2016年助残日活动总结
2016/04/01 职场文书
Python 中 Shutil 模块详情
2021/11/11 Python
Grafana可视化监控系统结合SpringBoot使用
2022/04/19 Redis