网页制作06-html,css,javascript初认识のhtml如何建立超链接

news2025/2/23 5:46:23

超链接有外部链接、电子邮件链接、锚点链接、空链接、脚本链接

一、内部链接

与自身网站页面有关的链接被称为内部链接

1、创建内部链接

1)语法:

<a href="链接地址">

……

</a>

2)举例应用: 

 3)实操代码:

<body>计算:
<p>
1.<a href="1"> 1+1=?</a></p>
<p>
2.<a href="2">2+2=?</a></p>
<p>
3.<a href="3">3+3=?</a></p>
</body>

 2、链接的目标窗口

简介:在创建网页的过程中,默认情况下超链接在原来的浏览器窗口中打开,可以使用 target属性来控制打开的目标窗口

1)语法:

_self  在当前页面中打开链接

_blank  在一个全新的空白窗口中打开链接

_top  在顶层框架中打开链接,也可以理解为在跟框架中打开链接

_parent  在当前框架的上一层里打开链接

new  在一个全新的空白窗口中打开链接

二、锚点链接 

网站中经常会有一些文档页面由于文本或者图像内容过多,。导致页面过长,为了方便用户查看文档中的内容在文档中需要进行锚点链接。

1、情景模拟:点击2+2的链接,跳转到答案4

2、步骤和语法:

1)建立锚点

<a name="锚点的名称”></a>

2、链接同一页面中的锚点 

<a href="#锚点的名称”></a>

3、链接到其他页面的锚点

首先在同一个目录下新建一个答案页面的html文件:

 <a href="链接的文件地址#锚点的名称”></a>

 3、锚点演示代码:

<hr>
计算:
<p>
1.<a href="#1" > 1+1=?</a></p>
<p>
2.<a href="#2" target="_parent">2+2=?</a></p>
<p>
3.<a href="答案页面.html#3" target="new">3+3=?</a></p>
<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br><br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>
<a name="1">2</a>
<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br><br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>
<a name="2">4</a>
<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br><br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>
<a name="3">6</a>

三、外部链接

简介:外部链接是指跳转到当前网站之外的资源:网页中最常用的是利用HTTP协议进行的外部链接是设置友情链接

1、基本语法

<a href="http://……">……</a>

2、友情链接演示效果: 

3、友情链接演示代码: 

<hr>
<p>友情链接:</p>
<p><a href="http://www.baidu.com">百度</a></p>
<p><a href="http://www.sina.com">新浪</a></p>
<p><a href="https://www.csdn.net/">CSDN</a></p>	

四、链接到Email

1、简介:

在网页上创建Email链接,当浏览者点击Email链接时,收件人的邮件地址有Email超链接中指定的地址自动更新无需浏览者输入

2、语法:

<a href="mailto:邮件地址”……</a>

 3、点击结果:

4、演示代码

<hr>
<p> Email链接</p>
<p><a href="mailto:CYDBUSINESS@OUTLOOK.COM">感谢您的收看,点击此处可以联系小编</a></p>

五、链接到ftp

1、简介:

Ftp是指文件传输协议,一个ftp站点通常包含一些容易上传和下载文件的文件目录。大部分的ftp网站需要一个用户名和密码来进入网站

2、语法:

<a href="ftp://ftp地址">……</a>

3、点击结果:

4、演示代码:

<a href="ftp://ftp.tsinghua.edu.cn">进入清华大学的ftp网站</a>

六、链接到telnet

1、简介:

telnet,常常用来登录一些bbs网站也是一种远程登录方式

2、语法:

<p><a href="telnet://地址">……</a></p>

七、下载文件

1、简介:

如果要在网站中提供下载资料,就是要为文件提供下载链接。如果超链接指向的不是一个网页文件,而是其他zip,mp3,a4v,exe等文件,单机链接的时候就会下载文件

2、语法

<p><a href="文件地址"></a></p>

3、 效果:

4、演示代码:

<hr>
	<p><a href="MOHA.mp3">MOHA音乐</a></p>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2303771.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

代码讲解系列-CV(七)——前沿论文复现

文章目录 一、论文速览1.1 确定baseline1.2 DepthMaster: Taming Diffusion Models for Monocular Depth Estimation 二、数据环境搭建2.1 环境搭建2.2 数据权重 三、推理debug3.1 单图推理3.2 数据集验证 四、模型训练4.1 数据读取4.2 训练流程 五、作业 一、论文速览 1.1 确…

数据库面试知识点总结

目录 1. MySQL 基础题1.1 执行⼀条 select / update 语句&#xff0c;在 MySQL 中发生了什么&#xff1f;1.2 MySQL 一行记录是怎么存储的&#xff1f; 2. 三大范式3. 数据库引擎3.1 Innodb3.2 MyISAM 4. 数据库索引4.1 索引分类4.2 索引优缺点4.3 索引使用场景4.4 优化索引方法…

1.25作业

1easytornado SSTI——tornado模板 hints.txt&#xff1a;在/fllllllllllllag里&#xff1b;计算filehash的方法&#xff08;需要cookie_secret,对filename进行md5拼接再第二次md5&#xff09; ?filename/hints.txt&filehash{ {2*3}}&#xff0c;跳转到另一个页面 存在且…

Power Query M函数

文章目录 三、PQ高阶技能&#xff1a;M函数3.1 M函数基本概念3.1.1 表达式和值3.1.2 计算3.1.3 运算符3.1.4 函数3.1.5 元数据3.1.6 Let 表达式3.1.6 If 表达式3.1.7 Error 3.2 自定义M函数3.2.1 语法3.2.2 调用定义好的自定义函数3.2.3 直接调用自定义函数3.2.4 自定义函数&am…

python argparse 解析命令行参数

可选参数 带 - 或者 -- 的参数都是可选参数&#xff0c;如果命令行不输入&#xff0c;得到的结果是 None 参数名只能使用下划线&#xff0c;不能使用中划线 default&#xff1a; 设置默认值 action&#xff1a; 默认是 store 方法&#xff0c;常用的是 store_true 命令行出…

【网络编程】服务器模型(二):并发服务器模型(多线程)和 I/O 复用服务器(select / epoll)

一、多线程并发服务器 在 高并发的 TCP 服务器 中&#xff0c;单线程或 fork() 多进程 方式会导致 资源浪费和性能瓶颈。因此&#xff0c;我们可以使用 多线程 来高效处理多个客户端的连接。 承接上文中的多进程并发服务器&#xff0c;代码优化目标&#xff1a; 1.使用 pthr…

自学Java-AI结合GUI开发一个石头迷阵的游戏

自学Java-AI结合GUI开发一个石头迷阵的游戏 准备环节1、创建石头迷阵的界面2、打乱顺序3、控制上下左右移动4、判断是否通关5、统计移动步骤&#xff0c;重启游戏6、拓展问题 准备环节 技术&#xff1a; 1、GUI界面编程 2、二维数组 3、程序流程控制 4、面向对象编程 ∙ \bulle…

Liunx(CentOS-6-x86_64)系统安装MySql(5.6.50)

一&#xff1a;安装Liunx&#xff08;CentOS-6-x86_64&#xff09; 安装Liunx&#xff08;CentOS-6-x86_64&#xff09; 二&#xff1a;下载MySql&#xff08;5.6.50&#xff09; MySql下载官网 二&#xff1a;安装MySql 2.1 将mysql上传到Liunx 文件地址 /usr/local/ 2…

Java Web开发实战与项目——开发一个在线论坛系统

在线论坛系统是一个常见的Web应用&#xff0c;通常具有用户注册、帖子发布、评论互动、消息推送等基本功能。开发这样一个系统&#xff0c;既涉及到前后端的技术栈选择&#xff0c;也需要考虑性能、扩展性等实际问题。本文将从设计论坛模块、实现消息推送与实时更新功能、以及优…

ubuntu24.04无法安装向日葵,提示依赖libgconf-2-4怎么办?

在向日葵官方下载的deb包&#xff0c;目前是SunloginClient_15.2.0.63062_amd64.deb&#xff0c;执行安装代码&#xff0c;如下&#xff1a; sudo < /span > dpkg< /span > -i< /span > SunloginClient_15< /span >.2< /span >.0< /span >…

Kubernetes 使用 Kube-Prometheus 构建指标监控 +飞书告警

1 介绍 Prometheus Operator 为 Kubernetes 提供了对 Prometheus 机器相关监控组件的本地部署和管理方案&#xff0c;该项目的目的是为了简化和自动化基于 Prometheus 的监控栈配置&#xff0c;主要包括以下几个功能&#xff1a; Kubernetes 自定义资源&#xff1a;使用 Kube…

WPF的页面设计和实用功能实现

目录 一、TextBlock和TextBox 1. 在TextBlock中实时显示当前时间 二、ListView 1.ListView显示数据 三、ComboBox 1. ComboBox和CheckBox组合实现下拉框多选 四、Button 1. 设计Button按钮的边框为圆角&#xff0c;并对指针悬停时的颜色进行设置 一、TextBlock和TextBox…

window安装MySQL5.7

1、下载MySQL5.7.24 浏览器打开&#xff1a; https://dev.mysql.com/get/Downloads/MySQL-5.7/mysql-5.7.24-winx64.zip 2、解压缩 下载下来的是一个压缩包&#xff0c;解压到你想放到的目录下面&#xff0c;我放的是“C:\MySQL” 3、配置MySQL环境变量 计算机右键 - 属性 …

数据结构:哈希表(二)

目录 一、哈希表 1、概念 二、哈希冲突 1、概念 2、冲突避免 &#xff08;1&#xff09;哈希函数设计 &#xff08;2&#xff09;负载因子调节 3、冲突解决 &#xff08;1&#xff09;闭散列 1、线性探测 2、二次探测 &#xff08;2&#xff09;开散列 4、哈希桶实…

blender笔记2

一、物体贴地 物体->变换->对齐物体 ->对齐弹窗(对齐模式&#xff1a;反方&#xff0c;相对于&#xff1a;场景原点&#xff0c;对齐&#xff1a;z)。 之后可以设置原点->原点--3d游标 二、面上有阴影 在编辑模式下操作过后&#xff0c;物体面有阴影。 数据-&g…

1.21作业

1 unserialize3 当序列化字符串中属性个数大于实际属性个数时&#xff0c;不会执行反序列化 外部如果是unserialize&#xff08;&#xff09;会调用wakeup&#xff08;&#xff09;方法&#xff0c;输出“bad request”——构造url绕过wakeup 类型&#xff1a;public class&…

【Quest开发】全身跟踪(一)

软件&#xff1a;Unity 2022.3.51f1c1、vscode、Meta XR All in One SDK V72 硬件&#xff1a;Meta Quest3 最终效果&#xff1a;能像meta的操作室沉浸场景一样根据头盔移动来推断用户姿势&#xff0c;实现走路、蹲下、手势匹配等功能 需要借助UnityMovement这个包 GitHub …

最新版本Exoplayer扩展FFmpeg音频软解码保姆级教程

ExoPlayer 是一个开源的 Android 媒体播放库&#xff0c;由 Google 开发和维护&#xff0c;用于替代 Android 系统自带的 MediaPlayer。它提供了更强大的功能、更好的性能和更高的灵活性&#xff0c;适用于各种复杂的媒体播放场景。所以被广泛用于各种播放器场景。 最近项目中…

JS:页面事件

文章目录 一、页面加载事件二、页面滚动事件三、页面尺寸事件总结 一、页面加载事件 有时候我们会把script的内容放在body前&#xff0c;这时候代码的执行在元素的加载之前&#xff0c;会导致页面元素未加载而报错 解决办法是调用Window的load加载事件&#xff0c;将所有操作放…

vue,vue3 keepalive没有效果,无法缓存页面include无效,keep-alive

keepalive没有效果&#xff0c;无法缓存页面&#xff1f; 问题大概是组件的name值不对应&#xff0c;vue2修改组件文件的name值&#xff0c;vue3保持组件文件名称和路由页面配置的name一致就可以了&#xff0c;如果vue3不想保持一致&#xff0c;必须手动在文件后面添加export..…