`
jyt
  • 浏览: 8378 次
社区版块
存档分类
最新评论

CSS中链接<a>的各种状态描述

阅读更多

一组专门的预定义的类称为伪类,主要用来处理超链接的状态。超链接文字的状态可以通过伪类选择符+样式规则来控制。伪类选择符包括:

  总: a 表示所有状态下的链接 如 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}

 如:

<style type="text/css">

a {font-size:16px}
a:link {color: blue; text-decoration:none;}
a:visited {color:green;text-decoration:none;} 
a:hover {color: red; text-decoration:underline;} 
a:active {color: yellow; text-decoration:none;} 

</style>

 

提示:在 CSS 定义中,a:hover 必须被置于 a:link 和 a:visited 之后,才是有效的。

提示:在 CSS 定义中,a:active 必须被置于 a:hover 之后,才是有效的。

提示:伪类名称对大小写不敏感。

 

 

在CSS中定义a:active/a:link/a:visited/a:hover顺序是:

a:link、a:visited、a:hover、a:active

一个便于记忆的“爱恨原则”(LoVe/HAte),即四种伪类的首字母:LVHA。

 

本文参考:

  1. w3cshool在线教程
  2. http://jeoff.blog.51cto.com/186264/43116
  3.  http://www.jz123.cn/text/0214505.html
分享到:
评论

相关推荐

    曼波整站系统5.3.0

    blog风格单元和分类的 META KEY, DESCRIPTION 生成问题:&lt;br&gt;把当前页面所有文章的META KEY, DESCRIPTION都累加起来,造成长度过长、关键词重复和描述难阅读等缺陷&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;二、增强功能&lt;br&gt;&lt;br&gt;1....

    前端css+html+布局笔记

    &lt;a&gt;链接的文字&lt;/a&gt; 属性 href 指向链接跳转的目标地址,可以是一个相对路径 还可以是#id属性值,这样当点击超链接以后,将会跳转到当前页面的指定位置 可以使用mailto:来创建一个发送电子邮件的...

    jQuery详细教程

    &lt;p&gt;&lt;a href="#" id="start"&gt;Start Animation&lt;/a&gt;&lt;/p&gt; &lt;div id="box" style="background:#98bf21;height:100px;width:100px;position:relative"&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; jQuery 隐藏和显示 通过 hide() 和 show...

    html入门到放弃笔记

    标记在使用时,用尖括号 "&lt;&gt;",标记的分类 1、封闭类型的标记 也称为 "双标记" , 必须成对出现 语法:&lt;标记&gt;内容&lt;/标记&gt; Demo : 1、创建 p 标记 --&lt;p&gt;...&lt;/p&gt; 2、创建 div 标记 -- &lt;div&gt;&lt;/div&gt; 3、创建 ...

    XML轻松学习手册--XML肯定是未来的发展趋势,不论是网页设计师还是网络程序员,都应该及时学习和了解

    看上面的"结构树",其中&lt;myfile&gt;是父元素,&lt;title&gt;,&lt;author&gt;是它的子元素,而&lt;myfile&gt;又是&lt;filelist&gt;的子元素。象&lt;title&gt;这样没有包含任何子元素的最后一级元素我们也称之为"页元素"。 4.Parser(解析软件) Parser...

    仿世纪佳缘婚介交友系统5.3 ASP+SQL

    sortid=ID号"&gt;&lt;/script&gt;,其中ID号为记录号,即为该列表中的调用ID列中的数值。然后把该调用代码加到模板相应地方即可。例如要调用最新5个会员,ID号为1,那么调用代码为:&lt;script src="Ns_News.asp?sortid=1"&gt;&lt;/...

    苹果8XPC和手机二合一完整版

    &lt;LI&gt;&lt;A href="{maccms:path}index.php?m=user-index.html" target="_blank"&gt;进入用户中心&lt;/A&gt;&lt;/LI&gt; &lt;LI&gt;&lt;A href="{maccms:path}index.php?m=user-logout.html"&gt;退出&lt;/A&gt; &lt;/LI&gt; &lt;/UL&gt; &lt;/DIV&gt; ******************...

    rar压缩软件.rar

    RAR &lt;命令&gt; [ -&lt;开关&gt; ] &lt;压缩文件&gt; [ &lt;@列表文件...&gt; ] [ &lt;文件...&gt; ] [ &lt;解压路径\&gt; ] 描述 命令行选项 (命令和开关) 提供了使用 RAR 创建和管理压缩文件的控制方法。命 令是一个字符串(或单个的字母),...

    ASP.NET的网页代码模型及生命周期

    ASP.NET中还提供了控件状态属性作为在服务器往返过程中存储自定义控件中的数据的方法。在页面控件中,如果有多个自定义控件使用多个不同的控件来显示不同的数据结构,为了让这些页面控件能够在在页面上协调的工作,...

    HTML5与CSS3基础教程(第8版)高清文字

    9.7 按状态选择链接元素 163 9.8 按属性选择元素 164 9.9 指定元素组 168 9.10 组合使用选择器 169 第10章 为文本添加样式 171 10.1 本章之前与本章之后 171 10.2 选择字体系列 173 10.3 指定...

    JavaScript完全自学宝典 源代码

    1.6.html 使用“&lt;marquee&gt;”标记,实现的滚动字幕效果。 1.7.html 使用JavaScript实现简单的字幕滚动。 1.8.html 使用JavaScript实现字幕连续滚动。 1.9.html 使用JavaScript实现的简单数字时钟。 ...

    styling-nav-layouts-pseudo-selectors-css-lab-abp-11-17

    在本实验结束时, index.html具有style.css样式的主页应该看起来和行为类似(请注意光标移动时的悬停状态): 将样式编码在style.css中,并使用带有href属性和值stylesheet的rel属性的标记将其包含在index.html中。...

    tumblenet-css

    tumblenet-css 发展下载cdn: https://cdn.jsdelivr.net/gh/tumblenet/tumblenet-css@master/css/tumblenet.min.cssTODO:编写项目描述快速链接先决条件(安装准备) 安装(安装步骤) 运行测试见[特拉维斯]。...

    指南针视网膜精灵:一个用于创建具有悬浮状态和活动状态的视网膜精灵的混合器

    指南针的视网膜精灵 公告-已描述 ...将_retina-sprites.scss放到您的首选位置,并将@include链接到您的主CSS文件中。 我更喜欢将其与其他常用帮助程序一起放到Utility文件夹中。 @import "utiliti

    OneNav 加强版支持多用户

    后台分类和链接列表做了一些优化,链接支持搜索(可指定分类),批量修改分类,置顶,记忆筛选状态等 分类列表支持搜索,批量删除和批量强制删除(分类下有链接时删除链接) 支持在列表直接修改数据,设置是否私有等便捷的操作...

    bikcraft:网页设计完整版Origamid网站设计

    Bikcraft项目 :person_biking: | Projeto Bikcraft :person_biking: |[EN]项目描述在这个项目中,我使用HTML,CSS和Javascript创建了一个有关自行车商店的页面。语言代码 HTML CSS Java脚本项目状态完成的 :check_...

    全屏带动画、触摸效果的jquery图片轮播插件

    2、文字描述 3、详情链接 4、图片轮播 5、动画效果(包括:图片放大、图片旋转、图片淡入浅出、图片上下左右移出) 6、左右控制按钮 7、状态小图标控制按钮 8、鼠标触摸切换 注意:想要看到动画效果请使用主流的...

    ExtAspNet_v2.3.2_dll

    -v0.2beta2版本中关于PersistChildren(true)的描述有误,这个是设计时属性,和运行时是否保持状态没有关系。 -修正CheckBox控件的CheckedChanged事件会被触发两次的BUG(Data PostBack-&gt;AutoPostBack, Event ...

    ExtAspNet v2.2.1 (2009-4-1) 值得一看

    -v0.2beta2版本中关于PersistChildren(true)的描述有误,这个是设计时属性,和运行时是否保持状态没有关系。 -修正CheckBox控件的CheckedChanged事件会被触发两次的BUG(Data PostBack-&gt;AutoPostBack, Event ...

    《JavaScript实例精通》[源代码]

    示例描述:页面中的链接地址个性化。 10_1.htm 按时消失的链接。 10_2.htm 带滚动提示的链接。 10_3.htm 动态变换的链接。 10_4.htm 滚动链接。 10_5.htm 不断闪动的链接。 10_6.htm 在按钮上显示不同的...

Global site tag (gtag.js) - Google Analytics