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. Go语言基础五:引用类型-切片和映射

    切片 Go的数组长度不可以改变,在某些特定的场景中就不太适用了.对于这种情况Go语言提供了一种由数组建立的.更加灵活方便且功能强大的包装(Wapper),也就是切片.与数组相比切片的长度不是固定的,可 ...

  2. 题解 洛谷 P2388 阶乘之乘

    目录 简要题意 题解 主要思路 一个 \(\omega(n)\) 的算法 一个 \(O(\log n)\) 的算法 一个算法 代码 算法 \(1\)(\(\omega(n)\)) 算法 \(2\) 算 ...

  3. SkiaSharp 之 WPF 自绘 投篮小游戏(案例版)

    此案例主要是针对光线投影法碰撞检测功能的示例,顺便做成了一个小游戏,很简单,但是,效果却很不错. 投篮小游戏 规则,点击投篮目标点,就会有一个球沿着相关抛物线,然后,判断是否进入篮子里,其实就是一个矩 ...

  4. 【RocketMQ】事务的实现原理

    事务的使用 RocketMQ事务的使用场景 单体架构下的事务 在单体系统的开发过程中,假如某个场景下需要对数据库的多张表进行操作,为了保证数据的一致性,一般会使用事务,将所有的操作全部提交或者在出错的 ...

  5. 【AGC】集成华为AGC崩溃服务实用教程

    ​简介 AppGallery Connect(简称AGC)崩溃服务提供了轻量级崩溃分析服务,集成Crash SDK,可以实现零代码快速集成,您的应用能够在崩溃时自动收集崩溃报告,帮助您了解应用版本质量 ...

  6. Spring 04: IOC控制反转 + DI依赖注入

    Spring中的IOC 一种思想,两种实现方式 IOC (Inversion of Control):控制反转,是一种概念和思想,指由Spring容器完成对象创建和依赖注入 核心业务:(a)对象的创建 ...

  7. PHP随机图片API

    相比上一个版本代码缩短了 此版本为图片专用 查看代码 <?php $img=file('img.txt');//txt文件 $url=array_rand($img);//imgtxt文档里面图 ...

  8. window桌面背景图片

    通过修改注册表项: \HKEY_CURRENT_USER\Control Panel\Desktop下的几个值,及可以将我们想要的图片设置成桌面的背景图 TileWallpaper   Wallpap ...

  9. Neo4j在linux上的安装与Springboot的集成

    Neo4j在linux上的安装与Springboot的集成 在linux安装: 前提:安装配置好java环境 1.下载neo4j 官方社区版下载地址:https://neo4j.com/downloa ...

  10. mysql选择列建立索引选择

    1. 选择Where子句中筛选性好的列,即列中数据大量不重复 2. 索引名最好 idx_ 开头 3. 包含在 Order by ; Group By; Distinct 中的字段可以添加索引,可以提高 ...