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

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

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

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

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

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

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

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

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<style>
a:link {color:red;} /* 未访问链接*/
a:visited {color:green;background-color:gray} /* 已访问链接 */
a:hover {color:pink;font-size:20px} /* 鼠标移动到链接上 */
a:active {color:yellow;} /* 鼠标点击时 */
</style>
</head>
<body>
<p><b><a href="http://www.baidu.com" target="_blank">这是一个链接</a></b></p>
<p><b>注意:</b> a:hover 必须在 a:link 和 a:visited 之后,需要严格按顺序才能看到效果。</p>
<p><b>注意:</b> a:active 必须在 a:hover 之后。</p>
</body>
</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. 【Java】-NO.16.EBook.4.Java.1.011-【疯狂Java讲义第3版 李刚】- AWT

    1.0.0 Summary Tittle:[Java]-NO.16.EBook.4.Java.1.011-[疯狂Java讲义第3版 李刚]-  AWT Style:EBook Series:Java ...

  2. jmeter 二次开发---实现自定义函数插件

    1.前提: 有时候,Jmeter自带的函数,可能不能满足于业务的需求,这时候,我们可以自己写一个函数插件: 2.创建maven工程 一直next,输入GroupID,ArtifactId->fi ...

  3. TM-align TM-score安装

    TM-align是由zhang yang LAB开发的一款做蛋白结构比对的软件. 下载链接:http://zhanglab.ccmb.med.umich.edu/TM-align/TMtools201 ...

  4. Python使用suds调用webservice报错解决方法:AttributeError: 'Document' object has no attribute 'set'

    使用python的suds包调用webservice服务接口,报错:AttributeError: 'Document' object has no attribute 'set' 调用服务接口代码: ...

  5. asp.net拦截器

    一 拦截器又称过滤器. asp.net mvc本身是自带3种拦截器:Action拦截器.Result拦截器.Exception拦截器. 应用中常见的拦截器有日志拦截器(Action拦截器)和异常处理拦 ...

  6. Faster-rcnn实现目标检测

      Faster-rcnn实现目标检测 前言:本文浅谈目标检测的概念,发展过程以及RCNN系列的发展.为了实现基于Faster-RCNN算法的目标检测,初步了解了RCNN和Fast-RCNN实现目标检 ...

  7. webpack使用四

    鼎鼎大名的Loaders登场了! Loaders是webpack提供的最激动人心的功能之一了.通过使用不同的loader,webpack有能力调用外部的脚本或工具,实现对不同格式的文件的处理,比如说分 ...

  8. javaweb防止表单重新提交

    一.前台验证 1.首先在from表单加一个隐藏域字段,设值为true.例如: <input type="hideen" name="tokenFlag" ...

  9. 切记!pycharm向mysql数据库添加数据过程

    python 导入包import requests   以爬取腾讯招聘网的招聘信息为例:(完整代码) import requestsfrom lxml import etreeimport pymys ...

  10. 强化学习---A3C

    Asynchronous Advantage Actor-Critic (A3C) 在RL任务中,我们本质上最终要学习的是策略(Policy) value-based方法:间接方法,即通过学习值函数( ...