链接可以使用任何css属性，包括字体、颜色、背景等等、

链接有四个状态，可在四个状态时设置不同的属性

a:link - 正常，未访问过的链接

a:visited - 用户已访问过的链接

a:hover - 当用户鼠标放在链接上时

a:active - 链接被点击的那一刻

当为链接的不同状态设置样式时，需要遵循a:hover 必须位于a:link 和a:visited之后，a:active 必须位于 a:hover 之后

例如编辑一个如下的html文件

  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.     <meta charset="utf-8">
  5.     <title>菜鸟教程(runoob.com)</title>
  6.     <style>
  7.         a:link {color:red;}      /* 未访问链接*/
  8.         a:visited {color:green;background-color：gray}  /* 已访问链接 */
  9.         a:hover {color:pink;font-size:20px}  /* 鼠标移动到链接上 */
  10.         a:active {color:yellow;}  /* 鼠标点击时 */
  11.     </style>
  12.     </head>
  13.     <body>
  14.         <p><b><a href="http://www.baidu.com" target="_blank">这是一个链接</a></b></p>
  15.         <p><b>注意：</b> a:hover 必须在 a:link 和 a:visited 之后，需要严格按顺序才能看到效果。</p>
  16.         <p><b>注意：</b> a:active 必须在 a:hover 之后。</p>
  17.     </body>
  18. </html>

初次点开时显示如下，将鼠标放在链接上显示粉色，并且字体变大；点击时显示黄色；点击之后显示绿色，并且背景为灰色

链接还可以使用text-decoration:none来设置去掉链接的下划线

css链接link的更多相关文章

  1. 【代码笔记】Web-CSS-CSS 链接(link)

    一,效果图. 二,代码. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  2. HTML5样式和列表、CSS链接的四种状态

    一.HTML5样式 1.标签: <style>:样式定义: <link>:资源引用: 2.属性: type="text/css":引入文档类型: rel=& ...

  3. 引用外部CSS的link和import方式的分析与比较

    很多网页中的 CSS 链接与引用是这样写的: <style type="text/css" media="screen"> @import url( ...

  4. css链接，列表，表格

    1.css链接 a:link - 正常,未访问过的链接 a:visited - 用户已访问过的链接 a:hover - 当用户鼠标放在链接上时 a:active - 链接被点击的那一刻 注意: a:h ...

  5. 18 章 CSS 链接、光标、 DHTML 、缩放

    1.CSS 中链接的使用 2.CSS 中光标的使用 3.CSS 中 DHTML 的使用 4.CSS 中缩放的使用 1 18 8. .1 1 S CSS  中 链接的使用 超链接伪类属性 a:link ...

  6. CSS链接伪类：超链接的状态

    一.状态: a:link{属性:值;} 链接默认状态 a:visited{属性:值;} 链接访问之后的状态 a:hover{属性:值;} 鼠标放到链接上显示的状态 a:active{属性:值;} 链接 ...

  7. CSS：CSS 链接

    ylbtech-CSS:CSS 链接 1.返回顶部 1. CSS 链接 不同的链接可以有不同的样式. 链接样式 链接的样式,可以用任何CSS属性(如颜色,字体,背景等). 特别的链接,可以有不同的样式 ...

  8. CSS中link与import的区别

    一.import的用法 1,在html文件中 <style type="text/css"> @import url(http://www.dreamdu.com/st ...

  9. CSS中link和@import的使用区别

    我们都知道在html中引入外部的CSS 有2种方式,link标签和@import,他们又什么区别呢? 1.从属关系区别@import是 CSS 提供的语法规则,只有导入样式表的作用:link是HTML ...

随机推荐

  1. 15-Python3 编程第一步

    2018-11-20 11:42:06 ''' 肥婆纳妾数列 斐波那契数列,又称黄金分割数列:这个数列从第3项开始,每一项都等于前两项之和, 随着数列项数的增加,前一项与后一项之比越来越逼近黄金分割的 ...

  2. 过拟合VS欠拟合、偏差VS方差

    1. 过拟合 欠拟合 过拟合:在训练集(training set)上表现好,但是在测试集上效果差,也就是说在已知的数据集合中非常好,但是在添加一些新的数据进来训练效果就会差很多,造成这样的原因是考虑影 ...

  3. python repr和str

    都是将对象转换为字符串 repr """ repr(object) -> string Return the canonical string representa ...

  4. webpack打包二进制文件报错

    错误示例,如下图所示: 修改webpack的module部分的rules,在其中添加一下代码: { test: /\.woff[0-9]{0,}$/, loader: "url-loader ...

  5. C#学习入门第二篇

     4.转义字符\b    退格符\n     换行\r     回车,移到本行开头\t     水平制表符\\      代表反斜线字符“\“\'        代表一个单引号字符@字在字符串前面表示 ...

  6. 关于plsqldev无法正常加载oracle instantclient中的oci.dll的其中一个原因

    事情的经过是这样的: 1. 新安装了windows10 系统,装了plsqldev 和 oracle instantclient,以及 instantclient sqlplus. 2.设置好了ORA ...

  7. DX9 空间坐标变换示例代码

    // @time 2012.3.25 // @author jadeshu #include <Windows.h> #include <d3d9.h> #include &l ...

  8. Spring Security实现RBAC权限管理

    Spring Security实现RBAC权限管理 一.简介 在企业应用中,认证和授权是非常重要的一部分内容,业界最出名的两个框架就是大名鼎鼎的 Shiro和Spring Security.由于Spr ...

  9. 使用Navicat导入SQL文件

    2018-11-04 19:35:12 开始写 刷新后就可以看见导入的数据库了(按F5刷新) 谢谢.Thank you.Salamat Do(撒拉玛特朵).あリがCám o*n(嘉蒙)とゥ(阿里嘎都) ...

  10. Axure RP Extension for Chrome修复

    Axure RP Extension for Chrome安装之前一直用 Firefox 浏览器浏览原型文件,一直用不惯,而且用 Firefox 的唯一目的就是看原型.其他都是用 Chrome 浏览器 ...