link       未点时链接色
visited  已点过的链接色
hover   光标放入链接上的色
active   点击时的样式

顺序一定要按link、visited、hover、active来设置

1)普通形式
a:link{}
a:visited{}
a:hover{}
a:active{}

<a href="...">...</a>

2)单个class
a.clsname{}
a.clsname:link{}
a.clsname:visited{}
a.clsname:hover{}
a.clsname:active{}

<a href="..."  class="clsname">....</a>

3)容器class
.cls a:link{}
.cls a:visited{}
.cls a:hover{}
.cls a:active{}

<div class="cls">
  <a href="">...</a>
</div>

4)ID的形式
#idname a:link{}
#idname a:visited{}
#idname a:hover{}
#idname a:active{}

<div id="idname">
    <a href="...">....</a>
</div>

css中链接的4个状态 link、visited 、hover、active 顺序与设置的更多相关文章

  1. CSS:a:link;visited;hover;active解释及正确顺序

    a:link 选择器设置指向普通的.未被访问页面的链接的样式, a:visited 选择器用于设置指向已被访问的页面的链接, a:active 选择器用于活动链接, a:hover 选择器用于选择鼠标 ...

  2. a:link visited hover active

    CSS中a:link.a:visited.a:hover.a:active的用法:建议:尽可能的手写代码,可以有效的提高学习效率和深度.在网页设计中,设计美观的超链接效果可以增强网站的用户体验,可能会 ...

  3. 超链接标签的CSS伪类link,visited,hover,active

    CSS伪类,是一种特殊的类,它针对到CSS选择器起作用,使选中的标签或元素产生特定的效果. CSS伪类的语法就是: 选择器 : 伪类名 { 属性 : 属性值 } 用的最多的伪类就是超链接a的伪类,有: ...

  4. [CSS3] Interactive Pseudo-Classes :link :visited :hover :active

    The interactive pseudo-classes for links (and buttons) allow us to make sure the user knows what ele ...

  5. 关于link, visited, hover, active

    LoVe/HAte 如果只是希望点击的时候显示背景色,那么只需要设置 :active,无需设置:hover #navbar:active, #backbtn:active { background-c ...

  6. css中按钮的四种状态

    css中按钮有四种状态 1. 普通状态2. hover 鼠标悬停状态3. active 点击状态4. focus 取得焦点状态 .btn:focus{outline:0;} 可以去除按钮或a标签点击后 ...

  7. CSS中链接文本为图片时的问题(塌陷、对应的图片建立倒角的问题)

    我在做Javascript DOM编程艺术的时候,在12章自己做练习时遇到了一个问题,<a>的内容<img>从<a>的盒子中溢出.代码如下: <a href= ...

  8. css中 禁止spa有点击状态

    <span class="an" onclick="selNum();"></span> var selNum = function() ...

  9. 关于css中a标签的样式

    CSS为一些特殊效果准备了特定的工具,我们称之为“伪类”.其中有几项是我们经常用到的,下面我们就详细介绍一下经常用于定义链接样式的四个伪类,它们分别是: :link :visited :hover : ...

随机推荐

  1. 虚拟机vmnet0、vmnet1和vmnet8的区别 虚拟网卡概述

    vmnet0,实际上就是一个虚拟的网桥 vmnet0,实际上就是一个虚拟的网桥,这个网桥有很若干个端口,一个端口用于连接你的Host,一个端口用于连接你的虚拟机,他们的位置是对等的,谁也不是谁的网关. ...

  2. leetcode 15. 3Sum 二维vector

    传送门 15. 3Sum My Submissions Question Total Accepted: 108534 Total Submissions: 584814 Difficulty: Me ...

  3. android中自定义下拉框(转)

    android自带的下拉框好用不?我觉得有时候好用,有时候难有,项目规定这样的效果,自带的控件实现不了,那么只有我们自己来老老实实滴写一个新的了,其实最基本的下拉框就像一些资料填写时,点击的时候出现在 ...

  4. vcenter api 接口获取开发

    通过连接vcenter 管理服务器,获取其下所有的:存储,网络,ESXI实体机,虚拟机相关信息的脚步: #!/opt/python3/bin/python3 #Author: zhaoyong &qu ...

  5. 7.Java web—tomcat9部署

    1)安装 在此之前要安装 好jdk和jre 下载绿色版 http://tomcat.apache.org/ 解压至:D:\Program Files (x86)\tomcat9 环境变更path添加两 ...

  6. webuploader设置timeout

    参考:http://www.codingwhy.com/view/841.html 备注下!

  7. UICollectionView 使用 介绍

    1.1. Collection View 全家福: UICollectionView, UITableView, NSCollectionView n   不直接等效于NSCollectionView ...

  8. MongoDB下配置用户权限

    MongoDB默认设置为无权限訪问限制 注:研究成果基于Windows平台 在部署mongodb成功后.进入控制台: 输入命令:mongod  use admin,你会发现该DB下包括了一个syste ...

  9. hdu2204Eddy&#39;s爱好

    大概题意是要你输出1到n中,可以表示成a^b的数,a,b都是大于0的整数的个数, 当中b大于1. 由于1到n中.可以全然开平方的个数就是(n^0.5)的整数部分. 以此类推能够得到,全然开立方.全然开 ...

  10. chrome 的onbeforeunload事件没有触发

    onbeforeunload event is not working when user not click inside the body of page 0down votefavorite   ...