CSS里面有专门针对超链接的选择器,也就是他们:

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

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

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

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

可以通过这些超链接状态选择器来根据超链接的状态设置不同的样式。

不仅可以通过这些选择器改变超链接的修饰,还能改变他们的颜色、背景色、字体、字体大小等等,以此来实现效果。

<style>
/*one这个类的超链接样式,在鼠标移动到上面时会改变颜色*/
a.one:link {color:#ff0000;}
a.one:visited {color:#0000ff;}
a.one:hover {color:#ffcc00;} /*two这个类的超链接样式,在鼠标移动到上面时字体会增大*/
a.two:link {color:#ff0000;}
a.two:visited {color:#0000ff;}
a.two:hover {font-size:150%;} /*three这个类的超链接样式,在鼠标移动到上面时会改变背景颜色*/
a.three:link {color:#ff0000;}
a.three:visited {color:#0000ff;}
a.three:hover {background:#66ff66;} /*four这个类的超链接在鼠标移动到上面时,会改变字体*/
a.four:link {color:#ff0000;}
a.four:visited {color:#0000ff;}
a.four:hover {font-family:Georgia, serif;} /*five这个类的超链接,在鼠标移动到上面时,会增加下划线*/
a.five:link {color:#ff0000;text-decoration:none;}
a.five:visited {color:#0000ff;text-decoration:none;}
a.five:hover {text-decoration:underline;}
</style>

PHP全栈开发(八):CSS Ⅴ 超链接 style的更多相关文章

  1. python 全栈开发,Day49(超链接导航栏案例,background,定位,z-index,iconfont使用)

    昨日内容回顾 浮动:是css中布局最多的一个属性 有浮动,一定要清除浮动 浮动不是一个元素单独浮动,要浮动一起浮动 清除浮动四种方式: 1.给父盒子添加高度,一般导航栏 2.给浮动元素后面加一个空的块 ...

  2. Python全栈开发:css引入方式

    css的四种引入方式: 1.行内式 行内式是在标记的style属性中设定CSS样式.这种方式没有体现出CSS的优势,不推荐使用. <p style="color: red;backgr ...

  3. Python 全栈开发八 文件处理

    一.基本流程 打开文件得到文件句柄 将文件句柄赋值给一个变量 通过文件句柄对文件进行操作 关闭文件 二.基本操作 1.文件句柄 f = open("a.txt",encoding= ...

  4. python 全栈开发,Day99(作业讲解,DRF版本,DRF分页,DRF序列化进阶)

    昨日内容回顾 1. 为什么要做前后端分离? - 前后端交给不同的人来编写,职责划分明确. - API (IOS,安卓,PC,微信小程序...) - vue.js等框架编写前端时,会比之前写jQuery ...

  5. spring boot + vue + element-ui全栈开发入门——基于Electron桌面应用开发

     前言 Electron是由Github开发,用HTML,CSS和JavaScript来构建跨平台桌面应用程序的一个开源库. Electron通过将Chromium和Node.js合并到同一个运行时环 ...

  6. 老男孩Python高级全栈开发工程师三期完整无加密带课件(共104天)

    点击了解更多Python课程>>> 老男孩Python高级全栈开发工程师三期完整无加密带课件(共104天) 课程大纲 1.这一期比之前的Python培新课程增加了很多干货:Linux ...

  7. 老男孩Python高级全栈开发工程师【真正的全套完整无加密】

    点击了解更多Python课程>>> 老男孩Python高级全栈开发工程师[真正的全套完整无加密] 课程大纲 老男孩python全栈,Python 全栈,Python教程,Django ...

  8. Python 全栈开发【第0篇】:目录

    Python 全栈开发[第0篇]:目录   第一阶段:Python 开发入门 Python 全栈开发[第一篇]:计算机原理&Linux系统入门 Python 全栈开发[第二篇]:Python基 ...

  9. .NET全栈开发工程师学习路径

    PS:最近一直反复地看博客园以前发布的一条.NET全栈开发工程师的招聘启事,觉得这是我看过最有创意也最朴实的一个招聘启事,更为重要的是它更像是一个技术提纲,能够指引我们的学习和提升,现在转载过来与各位 ...

  10. Python全栈开发【面向对象】

    Python全栈开发[面向对象] 本节内容: 三大编程范式 面向对象设计与面向对象编程 类和对象 静态属性.类方法.静态方法 类组合 继承 多态 封装 三大编程范式 三大编程范式: 1.面向过程编程 ...

随机推荐

  1. 出现 Expected 0 arguments but found 1 的bug原因

    问题:在给FileInputStream传入参数时报错 原以为是导错了包,结果试了几次都不行,最后才发现是项目名和这个方法名重复了,修改项目名就可以了! 红线出只是异常,抛出即可解决

  2. C#常见的集合

    3中数组式的 Array 在内存上是连续分配的,而且元素类型是一样的 特点:读取快,可以坐标访问,增删慢.长度不变. ArrayList 不定长,连续分配的,元素没有类型限制,任何元素都当成Objec ...

  3. linux常见命令(十二)

    sed/egrep将order.txt文件按行号展示出来,并删除第2,4行nl order.txt |sed '2,4d'将order.txt文件按行号展示出来,并删除第3行nl order.txt ...

  4. 倒计时0日!Apache DolphineScheduler4月 Meetup 大佬手把手教你大数据开发,离线调度

    随着互联网技术和信息技术的发展,信息的数据化产生了许多无法用常规工具量化.处理和捕捉的数字信息.面对多元的数据类型,海量的信息价值,如何有效地对大数据进行挖掘分析,对大数据工作流进行调度,是保障企业大 ...

  5. 从 React 原理来看 ahooks 是怎么解决 React 的闭包问题的?

    本文是深入浅出 ahooks 源码系列文章的第三篇,该系列已整理成文档-地址.觉得还不错,给个 star 支持一下哈,Thanks. 本文来探索一下 ahooks 是怎么解决 React 的闭包问题的 ...

  6. 大数据Hadoop入门教程 | (一)概论

    数据是什么 数据是指对客观事件进行记录并可以鉴别的符号,是对客观事物的性质.状态以及相互关系等进行记载的物理符号或这些物理符号的组合,它是可识别的.抽象的符号. 它不仅指狭义上的数字,还可以是具有一定 ...

  7. Spring源码-Bean生命周期总览

  8. 《HelloGitHub》第 77 期

    兴趣是最好的老师,HelloGitHub 让你对编程感兴趣! 简介 HelloGitHub 分享 GitHub 上有趣.入门级的开源项目. https://github.com/521xueweiha ...

  9. Python入门系列(八)日期时间、数学、json

    日期时间 Python中的日期本身不是数据类型,但我们可以导入一个名为datetime的模块,将日期作为日期对象使用. import datetime x = datetime.datetime.no ...

  10. luogu P2882 [USACO07MAR]Face The Right Way G

    题目描述 Farmer John has arranged his N (1 ≤ N ≤ 5,000) cows in a row and many of them are facing forwar ...