HTML超链接之伪类注意事项
今天在复习html相关知识的时候发现了一个很常用,却经常被人们所忽略的知识点。那就是超链接伪类的使用。下面我就直接用代码来说明这一切。
伪类的相关代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>超链接伪类的使用</title>
</head>
<style type="text/css">
a:link{
color: gray;
}
a:visited{
color: purple;
}
a:hover{
color: red;
}
a:active{
color: green;
}
</style>
<body>
伪类,说是标签的四种控制方式,其实也可以认为是四种不同的状态的显示,如下
<hr />
<br />
<br />
<br />
<a href="#">这里是一个超链接</a>
<br></br>
<ul>
<li>注意在style中的顺序必须是LVHA,否则界面刷新出来的时候会打散你的想象的!</li>
<li>LVHA分别代表:Link初始化的状态;Visited浏览过超链接的状态;Hover鼠标划上超链接时候的状态;Active表示正在点击超链接时刻的状态</li>
<li>一般来说,这四种状态我们最为常用的是HV,而AC基本上不怎么用。</li>
<li>注意对超链接的合理的使用!否则会产生超链接泛滥的负面效果!</li>
</ul>
</body>
</html>
在代码中我已经对伪类的使用做了一个小的总结,所以就不再进行总结了。
结果展示
HTML超链接之伪类注意事项的更多相关文章
- CSS中的背景、雪碧图、超链接的伪类样式
一.背景 1.背景颜色 background-color: red; 2.背景图片 background-image: url("../../img/l1.png"); 3.图片填 ...
- web标准(复习)--5 超链接伪类
今天我们开始学习超链接伪类,包含以下内容和知识点: 链接的四种样式 将链接转换为块状 用css制作按钮 首字下沉 一.超链接的四种样式 超链接可以说是网页发展史上一个伟大的发明,它使得许多页面相互链接 ...
- Web标准:五、超链接伪类
Web标准:五.超链接伪类 知识点: 1.链接的四种样式 2.将链接转换为块状 3.用css制作按钮 4.首字下沉 1)链接的四种样式 超链接有四个伪类,分别是: a:link 未访问的链接 a: ...
- CSS(五):背景、列表、超链接伪类、鼠标形状控制属性
一.背景属性 1.背景属性用来设置页面元素的背景样式. 2.常见背景属性 属性 描述 background-color 用来设置页面的背景色,取值如red,#ff0000 background-ima ...
- 超链接标签的CSS伪类link,visited,hover,active
CSS伪类,是一种特殊的类,它针对到CSS选择器起作用,使选中的标签或元素产生特定的效果. CSS伪类的语法就是: 选择器 : 伪类名 { 属性 : 属性值 } 用的最多的伪类就是超链接a的伪类,有: ...
- 超链接a标签的伪类选择器问题,Link标签与visited标签的失效问题(问题介绍与解决方法)。
<!DOCTYPE html>< html>< head> <meta charset="utf-8" /> < ...
- html 超链接标签 锚点 a标签伪类
一个简易的连接 <a href="01.html">01</a> <body> <a href="01.html" t ...
- CSS链接伪类:超链接的状态
一.状态: a:link{属性:值;} 链接默认状态 a:visited{属性:值;} 链接访问之后的状态 a:hover{属性:值;} 鼠标放到链接上显示的状态 a:active{属性:值;} 链接 ...
- CSS3伪类与伪元素的区别及注意事项
CSS中伪类与伪元素的概念是很容易混淆的 今天就来谈谈伪类与伪元素之间的区别 定义 首先先来看看伪类与伪元素的定义 w3c中对于它们是这么解释的 伪类:用于向某些选择器添加特殊的效果 伪元素:用于将特 ...
随机推荐
- 你知道src、url、href的全称吗?
url:Uniform Resource Locator统一资源定位符 src:Source资源 href:Hypertext Reference超文本引用
- AQS简简单单过一遍
前言 回顾前面: 多线程三分钟就可以入个门了! Thread源码剖析 多线程基础必要知识点!看了学习多线程事半功倍 Java锁机制了解一下 只有光头才能变强! 本来我是打算在这章节中写Lock的子类实 ...
- jquery form提交
$('#form').form("submit", { url: "Stu_sendsms.aspx", onSubmit: function () { $(' ...
- Linux平台安装MongoDB
MongoDB 提供了 linux 各发行版本 64 位的安装包,你可以在官网下载安装包. 下载地址:https://www.mongodb.com/download-center#community ...
- fastDFS 安装 配置 使用
fastDFS 安装 配置 使用 关于安装 本文采用的是源码的安装方式,其他安装方式请自行百度 简单介绍 1.背景 FastDFS是一款开源的.分布式文件系统(Distributed File Sys ...
- Python小代码_14_交换 2 个变量的 3 种方式
a = 4 b = 5 #第一种 c = a a = b b = c print(a, b) #输出结果 #5 4 #第二种 a = a + b b = a - b a = a - b print(a ...
- 重写轮子之 kNN
# !/usr/bin/python # -*- coding:utf-8 -*- """ Re-implement kNN algorithm as a practic ...
- JQuery 分页显示jquery-pager-1.0.js
原版是jquery-pager-1.0.js,经过变更修改加上按照项目中的一些需要修改过来. //初始化分页控件 PagerOptions为配置参数 url为要提交的url地址,如果不需要提交则可以为 ...
- 修改apache默认主页,重定向404页面
yum 下载apache后默认主页 默认配置文件: vim /etc/httpd/conf/httpd.conf /etc/httpd/conf.d/welcome.conf 跳转页面到 /var/w ...
- 数据结构Java版之交换算法(一)
交换的本质是拷贝,其中拷贝包括两种方式.值拷贝和指针拷贝,在java中没有指针,为此,我们可以理解为地址拷贝,在我看来,指针就是地址. 1.传值方式示例: 由上述示例可得,传值,不能起到交换的作用,原 ...