html页面点击各个a标签超链接怎样固定头部和底部
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html页面点击各个a标签超链接怎样固定头部和底部相关的知识，希望对你有一定的参考价值。
参考技术A Turbolinks 一个可以实现这个功能的插件。HTML超链接音频和视频以及内嵌框架
HTML超链接、音频和视频以及内嵌框架
1.1 超链接
1.1.1 什么是超链接
当用户点击文字、图像、视频等页面元素时，页面会发生跳转，则这些页面元素就是超链接
1.1.2 超链接标签< a >
格式：
<a href="url地址" target="页面打开的方式">页面元素(文字、图像、音频、视频)</a>
| 属性 | 含义 |
|---|---|
| href | 值是要跳转的页面的地址，通常用“#”表示空链接 |
| target | 新页面打开的方式，取值有“_self”和“_blank”，“_self”表示在原窗口打开页面，是target属性的默认值，“_blank”表示在新窗口中打开页面 |
例如，target取值为“_self”时，点击链接，网页会在原窗口打开页面：
<a href="#" target="_self">target取值为_self时</a>
target取值为“_blank”时，点击链接，网页会在新窗口打开页面：
<a href="#" target="_blank">target取值为_blank时</a>
1.1.3 通过超链接实现“锚点”
通过超链接实现“锚点”，可以提高页面的检索速度。
设置方法：
第一步：在“锚点”位置给标签添加id属性
第二步：在超链接位置中< a >标签的href属性值为“#id名”
例如，下面的代码中，a标签与p标签之间隔着很多距离，p标签的id名为jmcbp，a标签的href属性值为#jmcbp，那么点击a标签，就可以快速跳转到p标签上。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>超链接</title>
</head>
<body>
<a href="#jmcbp"></a>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<p id="jmcbp">橘猫吃不胖</p>
</body>
</html>
1.2 音频标签
1.2.1 音频标签< audio >
格式为：
<audio src="音频文件的地址" controls="controls" autoplay="autoplay"></audio>
1.2.2 属性
| 属性 | 含义 |
|---|---|
| src | 表示音频文件的地址 |
| controls | 表示标签带有控制按钮 |
| autoplay | 表示是否可以进行自动播放 |
| loop | 表示循环播放 |
| preload | 页面加载时音频也加载，并预备播放，若使用了“autoplay”属性则该属性被忽略 |
1.3 视频标签
1.3.1 视频标签< video >
格式为：
<video src="视频文件的地址" controls="controls" autoplay="autoplay" poster="视频文件下载时显示的图片"></video>
1.3.2 属性
| 属性 | 含义 |
|---|---|
| src | 表示视频文件的url |
| controls | 表示标签带有播放控制的按钮 |
| autoplay | 表示是否可以进行自动播放 |
| poster | 表示在视频文件下载时显示的图片 |
| loop | 表示循环播放 |
| height | 表示视频播放器的高度 |
| width | 表示播放器的宽度 |
1.4 内嵌框架标签
内嵌框架标签作用是将页面显示在指定的位置。
格式为：
<iframe src="要嵌入的文件/网页地址" frameborder="边框宽度" name="框架名称" height="框架高度" width="框架宽度"></iframe>
例如，iframe标签中src属性插入CSDN的主页链接，那么框架中就会显示CSDN的主页，并且可以嵌套使用：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>内嵌框架</title>
</head>
<body>
<br><br><br><br><br>
<iframe src="https://www.csdn.net/?spm=1001.2014.3001.4476" frameborder="1" name="kj" height="500" width="1200"></iframe>
</body>
</html>
以上是关于html页面点击各个a标签超链接怎样固定头部和底部的主要内容，如果未能解决你的问题，请参考以下文章