html中的超链接

首先我们来认识一下超链接标签，其作用是从一个页面链接到另一个页面
链接的语法格式：

<a href="跳转目标- target="目标窗口的弹出方式">文本或图像</a>

两个属性的作用如下:

1.外部链接

例如：

< a href="http:/ / www.baidu.com " target="_self">百度</a >.

注意：target="__self"是在当前页面打开，target="___blank"会在新窗口打开

2.内部链接

网站内部页面之间的相互链接.直接链接内部页面名称即可，例如< a href= “index.html”>首页

其中index.html是我们自己编写的HTML文件。

3.空链接

如果当时没有确定链接目标时,< a href="#">首页 .

<a href="#>公司地址</a>

4.下载链接

如果 href里面地址是一个文件或者压缩包，会下载这个文件。

4.下载链接:地址链接的是文件.exe或者是 zip等压缩包形式

5.网页元素链接

在网页中的各种网页元素，如文本、图像、表格、音频、视频等都可以添加超链接.

<a href="http://wae . baidu.com"><img src="img.jpg" /></a>

6.锚点链接

锚点:定义页面内滚动跳转

页面内定义了“id”，可以通过a标签链接到它的页面滚动位置，前提是页面要足够高，有滚动条，且元素不能在页面顶部

点我们点击链接,可以快速定位到页面中的某个位置

实现案例：返回顶部功能

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>多行文字居中</title>
</head>
<style >#fhdb{width:100%;height:50px;}.one {width:500px;background-color:pink;display: table;text-align: center;padding:30px;}.one span {display: table-cell;vertical-align:middle;}.fanhui{width: 80px;height: 80px;/*background-color:red;*/float:right;position: fixed;bottom:0;right:0;}input::-webkit-input-placeholder {color: #000000;}/* 火狐 Mozilla Firefox 4 to 18 *//*input:-moz-placeholder {color: #c0a16b;}*//* 火狐 Mozilla Firefox 19+ */input::-moz-placeholder {color: red;}/* Internet Explorer 10+ */input:-ms-input-placeholder {color: #28a4c9;}
</style>
<body><div id="fhdb"><!-- 这里是导航栏 --><h1>这里是顶部</h1></div><div class="one"><span>文字描述内容区域，段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域，段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域，段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域，段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域，段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域，段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域，段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域文字描述内容区域段落文本显示文字描述内容区域，段落文本显示文字描述内容区域</span></div><div class="thrre"><table border="1"><caption><h2>人员信息展示</h2></caption><thead><tr><th>序号</th><th>姓名</th><th>邮箱</th></tr></thead><!--表身体--><tbody><tr><td>1</td><td>曹阳</td><td>goegry@163.com</td></tr><tr><td>2</td><td>安迪</td><td>andy@163.com</td></tr></tbody><tfoot><tr><td>总结</td><td colspan="2" align="right">2人</td></tr></tfoot></table></div><div class="fanhui"><button><a href="#fhdb">返回顶部</a></button></div>
</body>
</html>

html中的超链接（总结）相关推荐

[学习]GridView 学习集合 -- GridView中使用超链接的技巧
GridView中使用超链接的技巧数据绑定方式有两种,如下示例: Eval方式 <%# Eval("id") %> Bind方式 <%# Bind(" ...
jsp中去掉超链接下划线吗_好烦啊，PPT 插入超链接，文字自动变色还有下划线！还不能改？！...
「老师,PPT 中插入超链接,为什么设置之后文字不仅改变了颜色,还多了一条下划线,但是选中后更改没有反应--有没有办法让文字看着正常一点?」效果类似这样: 这是在给秋叶PPT的学员进行答疑的时候,遇 ...
java 邮件超链接_将Excel范围中的超链接传输到Outlook电子邮件
我正在尝试从excel范围(rng 1到6)创建一个电子邮件,其中包含A列和D列中每个单元格的超链接 . 以下是为这些范围创建超链接的代码示例 . 一切正常 . ActiveSheet.Hyperli ...
java excel 超链接_Java 编辑、删除Excel中的超链接
本文介绍如何编辑Excel文档中的超链接,包括编辑超链接显示文本.链接地址及删除指定超链接.使用免费版Excel类库工具,Free Spire.XLS for Java.Jar包获取可在官方网站下载, ...
Python提取Word文档中所有超链接地址和文本
使用Python扩展库python-docx操作Word文档的相关文章,可以阅读: Python批量导入图片到Word文件 Python查找Word文件中红色和加粗的文字(附元宵节送书活动中奖名单) ...
html语言中的链接方式,什么是超链接_在html中设置超链接的方法 - 驱动管家
什么是超链接?html如何设置超链接?如果想要优化自己的网站,那么肯定少不了超链接的存在.正常情况下,我们会在html中设置超链接,从而使得点击的时候会跳转到需要的界面,从而增加自己网站的浏览量.下面 ...
cmake中添加引用动态链接_C# 添加、编辑、删除PPT中的超链接
本文介绍通过C# 编程在PPT幻灯片中添加超链接(包括给文本添加超链接.给图片添加超链接)的方法,以及编辑.删除幻灯片中已有的超链接. 程序使用类库:Free Spire.Presentation f ...
Java解析网页中的超链接批量下载用
目录 1. 使用场景 2. 找列表 3. 分析下载地址列表 4. 使用下载工具下载 5. 源代码 1. 使用场景迅雷的批量下载功能不好用,还会把网页中的超链接的原文件给重命名,很烦. 另外,经常使用 ...
允许在CAD中操作超链接！Aspose.CAD最新版v19.9新功能你都了解吗？
Aspose.CAD for .NET(点击下载)是一个独立的AutoCAD处理API.它提供将DWG,DWF和DXF文件转换为高质量PDF和光栅图像的功能.开发人员可以从AutoCAD文件中选择和转 ...
python读取xlsx的超链接_用Python从Excel（.xlsx）中提取超链接
我主要关注的是用于Excel文件操作的xlrd和openpyxl库.但是,xlrd当前不支持.xlsx文件的formatting_info=True,因此我不能使用xlrd hyperlink_map ...

html中的超链接（总结）