html <a>标签

news/2025/2/21 15:55:22/

标签定义及使用说明

<a> 标签定义超链接,用于从一个页面链接到另一个页面。

<a> 元素最重要的属性是 href 属性,它指定链接的目标。

在所有浏览器中,链接的默认外观如下:

  • 未被访问的链接带有下划线而且是蓝色的
  • 已被访问的链接带有下划线而且是紫色的
  • 活动链接带有下划线而且是红色的

提示:如果没有使用 href 属性,则不能使用 hreflang、media、rel、target 以及 type 属性。

 

a标签的原理:

1.a标签的href属性值如果是以http开头的,那么浏览器会马上启动http解释器去解释该网址,首先会在本地机器去找一个hosts文件,如果在hosts文件上该域名没有对应的主机,那么浏览器就去到对应的dns服务器去寻找该域名对应的主机号。如果找到了对应的主机,那么该请求就会发给对应的主机。

2.如果a标签的href属性值没有以任何协议开头,那么浏览就会启动file协议解释器去解释该资源路径。

3.如果a标签的href属性值并不是以http开始,而且其他的一些协议,那么这时候浏览器就回去到我们本地的注册表中去查找是否有处理这种协议的应用程序,如果有,那么马上启动该应用程序处理该协议。邮件的协议:mailTo;迅雷的协议:thunder。

伪类状态

a标签中有四个伪类,分别是:

  1. link:设置a对象在未被访问前的样式表属性
  2. visited:设置a对象在其链接地址已被访问过时的样式表属性
  3. hover:设置对象在其鼠标悬停时的样式表属性
  4. active:设置对象在被用户激活(在鼠标点击与释放之间发生的事件)时的样式表属性

通过写入伪类的样式表,可以修改a标签在各种状态下的显示形态,为了产生预期的效果,在 CSS 定义中,a:hover 必须位于 a:link 和 a:visited 之后,a:active 必须位于 a:hover 之后,所以a标签伪类样式重写的顺序应该是:a:link、a:visited、a:hover、a:active。由于CSS样式的优先级问题了。伪类的特殊性(应用优先级)是同样的,所以,后出现的伪类会覆盖先出现的伪类(同时激活)。

 

注意:a标签href=""的时候,默认状态时:visited状态;a标签没有href属性的时候,默认状态时:active状态,这两种情况都不影响:active和:hover的触发,但是永远不会触发:link

 


http://www.ppmy.cn/news/529092.html

相关文章

【图像处理】Sobel算子实现水平边缘检测、垂直边缘检测;45度、135度角边缘检测

%File Discription: %45和135角边缘检测&#xff1b;用于那些边界不明显的图片 %不太适用于复杂图&#xff0c;复杂图用水平和垂直边缘检测 %Author:Zhang Ruiqing %CreateTime:2011.8.8&#xff08;What a good day!(*^__^*) &#xff09;SourcePicimread(lena.jpg); subplot(…

html5a标签的行内样式,HTML5 a 标签

什么是a标签&#xff1f; 更新时间: 09/22/2018由sky8g编辑 a标签的作用&#xff1a;HTML 标记是一个内联HTML元素&#xff0c;它定义了一个超链接。超链接允许用户从一个页面导航到另一个页面。以下部分包含关于此标记的信息&#xff0c;包括如何使用它的示例以及相关属性和浏…

HTML5 <head> 标签、HTML5 <i> 标签

HTML5 <head> 标签 实例 HTML5 <head> 标签表示文档的头部&#xff0c;其中包含了与该文档有关的信息&#xff01; 一份在头部带有 <title> 标签的 HTML 文档&#xff1a; <!DOCTYPE html> <html> <head> <meta charset"utf-8&…

DRIVER_OVERRAN_STACK_BUFFER: Sony NW-A45插入PC必蓝屏问题(Bus Hound相关)

问题 近期调试 USB&#xff0c;BUS Hound v6 无问题。心血来潮安装了 v7 后&#xff0c;体验后又回退到 v6。然后只要插入 Sony NW-A45&#xff0c;电脑100% 必绿屏&#xff08;WIN11&#xff09;&#xff0c;提示信息&#xff1a; DRIVER_OVERRAN_STACK_BUFFER 解决 近期项…

HTML5 之 A 标签

概述 a 元素可通过其href属性创建指向其他网页、文件、同一页面内的位置或其他URL的超链接。 其基本属性及含义如下。 href&#xff1a;链接目标的URLhreflang&#xff1a;指定目标URL的语言rel&#xff1a;指定当前文档和被链接文档的关系target&#xff1a;指定打开目标URL的…

Java Map和Set

1 Map Map是一个接口&#xff0c;该类没有继承自Collection,该类中存储的是<K,V>结构的键值对&#xff0c;并且K一定是唯一的&#xff0c;不能重复。 1.1 Map的常用方法说明 import java.util.Collection; import java.util.HashMap; import java.util.Map; import ja…

SpringCloud Alibaba入门5之Hystrix的使用

我们继续在前一章的基础上进行学习。 SpringCloud Alibaba入门5之使用OpenFegin调用服务_qinxun2008081的博客-CSDN博客 上一节我们已经使用OpenFeign完成了服务间的调用&#xff0c;如果现在存在大量的服务&#xff0c;每个服务有若干个节点&#xff0c;其中一个节点发生故障…

python 开放端口探测工具

""" 开放端口扫描工具 """ import socket from concurrent.futures import ThreadPoolExecutor from optparse import OptionParserdef port_scan(ip, port):sock socket.socket(socket.AF_INET, socket.SOCK_STREAM)sock.settimeout(1)try:soc…