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. Spring的@Configuration来代替xml配置

    一. Xml配置法 下面是一个典型的spring配置文件(application-config.xml): [xml] view plain copy <beans> <bean i ...

  2. BZOJ [P2124] 等差子序列

    线段树维护哈希值 要求出现长度大于三的等差子序列,我们只要找到长度等于三的就可以了 初看本题没有思路,只能暴力枚举,O(n^4) 后来发现,这个序列是n的一个排列,那么每个数字都只会出现一次 我们可以 ...

  3. Louvain algorithm for community detection

    主要理解Louvain 算法中对于模块度的定义:模块度是评估一个社区网络划分好坏的度量方法,它的物理含义是社区内节点的连边数与随机情况下的边数只差,它的取值范围是 [−1/2,1).可以简单地理解为社 ...

  4. Spring实战Day7面向切面编程术语介绍

    #### 面向切面编程 为什么需要切面? 有些功能需要在应用中的多个地方使用到,但是我们又不想在着每个地方都调用他们 切面术语 通知(advice):切面需要完成的工作 通知的类型(什么时间完成工作) ...

  5. JS那些事儿——Gulp的入门使用

    前言 新人使用gulp的一个记录. 首先对于第一个新事物,我会问gulp这是什么? 答:gulp是一个自动化构建工具,它可以做一些自动化的任务,比如: 检查Javascript 编译Sass(或Les ...

  6. BUPT复试专题—科学计算器(2009)

    题目描述 给你一个不带括号的表达式,这个表达式只包含加.减.乘.除,请求出这个表 达式的最后结果,最后结果一定是整数: 输入 一个数学表达式,只包括数字,数字保证是非负整数,以及五种运算符 " ...

  7. 转:为什么Uber宣布从Postgres切换到MySQL?

    转: http://mp.weixin.qq.com/s?__biz=MzAwMDU1MTE1OQ==&mid=2653547609&idx=1&sn=cbb55ee823dd ...

  8. SolidEdge 如何由装配图快速进行标注和零件序号编写 制作BOM表

    点击"零件明细表",然后点击要生成序号的视图,然后点击前面两项(自动标号和放置清单),点击完成后效果如下图所示.   在点击完成之前,先点击他前面的一个按钮,取消勾选"项 ...

  9. MapReduce将HDFS文本数据导入HBase中

    HBase本身提供了很多种数据导入的方式,通常有两种常用方式: 使用HBase提供的TableOutputFormat,原理是通过一个Mapreduce作业将数据导入HBase 另一种方式就是使用HB ...

  10. Hadoop教程(一)

    英文原文:cloudera,编译:ImportNew – Royce Wong Hadoop从这里开始!和我一起学习下使用Hadoop的基本知识,下文将以Hadoop Tutorial为主体带大家走一 ...