很多站长朋友们都不太清楚html文件怎么创建锚点，今天小编就来给大家整理html文件怎么创建锚点，希望对各位有所帮助，具体内容如下：
本文目录一览： 1、 html 锚点三种实现方法 2、 如何在html中创建锚点链接? 3、 HTML网页制作：制作锚点链接 4、 HTML代码中什么是锚点？怎么设置锚点？ html 锚点三种实现方法在网页中经常用到锚点，特别是在比较长的页面中锚点的使用会增加用户体验，现在php中文网介绍html 锚点三种实现方法
1） . 在同一页面中
<a name="add"></a> 或者 <a id="add"></a> （ps：用id兼容性好些）
<a href="#add">跳转到add</a>
2） . 在不同页面中，锚点定位在a.html中，从另外一个页面的链接跳转到这个锚点
<a href="a.html#add">跳转到a.add</a>
3） . 点击链接触发js事件，同时跳转到锚点，有两种处理方式：
第一种：
<a href="#add" onclick="add()">触发add函数并跳转到add锚点</a>
第二种：
<p id="pNode"></p>
<a href="#" onclick="document.getElemetnById('pNode').scrollIntoView(true);return false;">通过scrollIntoView实现锚点效果</a>
scrollIntoView()的用法
scrollIntoView 是一个与页面（容器）滚动相关的API（ 官方解释 ），该API只有boolean类型的参数能得到良好的支持（firefox 36+都支持），所以在这里只讨论参数Boolean类型的情况
调用方法为 element.scrollIntoView() 参数默认为true。
参数为true时调用该函数，页面（或容器）发生滚动，使element的顶部与视图（容器）顶部对齐；
参数为false时，使element的底部与视图（容器）底部对齐。
TIPS：页面（容器）可滚动时才有用！
如何在html中创建锚点链接?建立锚点需要标签的id和a标签相互配合。举个例子:
<a href="#haha">跳到哈哈</a>
<div style="height: 800px"></div>
<div style="height: 800px" id="haha">哈哈</div>
以上就是一个简单锚点的写法，当然也可以实现不同页面的锚点跳转，就是把href的地址换一下就可以了。
HTML网页制作：制作锚点链接01
右击桌面，新建一个文本文档。
02
打开文档，输入需要写的HTML代码，如下图所示：
<html>
<head>
<title>简单html页面</title>
</head>
<body>
<a href="url">明天，你好！</a>
</body>
</html>
03
点击文件中的保存文档。
04
选择用浏览器的方式打开文档，就可以看到我们刚刚编辑的锚点链接了。
HTML代码中什么是锚点？怎么设置锚点？对于网页制作初学者来说锚点应当是个很新鲜的词，但是在我们浏览网页的时候确实经常可以见到的。现在就给大家介绍一下锚点是什么以及怎么设置锚点吧。
锚点是什么？
在W3C标准字“Anchor”一词即为锚点，其解释为：资源中的某个区域可以是零个、一个或多个链接的目标或源。锚点可以引用整个资源，或者的特定部分，或者资源的特定表现形式。
通俗的理解：锚点是一种超链接，只是它是页面内部的超链接。比如我们有一个网页很长很长，而且里面的内容，可以分为N个部分。这样的话，我们就可以在网页的顶部设置一些锚点，这样便可以方便浏览者点击相应的锚点，到达本页内相应的位置，而不必在一个很长的网页里自行寻找。
怎么设置锚点？
首先打开制作网页的工具，现在很多软件都可以用来制作网页，像是eclipse、myeclipse、Dreamweaver、visual studio等等，都是很好用的软件，ide。
打开一个HTML页面，不同的软件有不同的打开方式，下面是用Adobe Dreamweaver软件来打开一个页面的。
基本代码如下所示。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
</body>
</html>
在body里面填写如下的代码。
<body>
<a href="q.html#p1">文字1</a>
<a href="q.html#p2">文字2</a>
<a href="q.html#p3">文字3</a>
<a name="p1"></a>
<p>p1段落</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<a name="p2"></a>
<p>p2段落</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<a name="p3"></a>
<p>p3段落</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
</body>
5
锚点的格式代码
<a name="p3"></a>
<p>p3段落</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
<p>------------------</p>
6
运行结果如下所示：
点击【段落2】会立马跳转到段落2中。
在网页设计中怎么使用锚点？
锚就是在文档中设置位置标记，并给该位置一个名称，以便引用。通过创建锚点，可以使链接指向当前文档或不同文档中的指定位置。锚点常常被用来跳转到特定的主题或文档的顶部，使访问者能够快速浏览到选定的位置，加快信息检索速度。
1、设置锚点
把光标置于文档窗口想要设置锚点的地方，点击插入面板中”常用”／”常用锚记”。在弹出的对话框中起一个锚名字。
2、创建锚点链接
选择要建立链接的文本或图像，在属性面板的链接中输入一个#号和锚点名。例如：#aa。 要链向不同页面中的锚点，则点击链接边的文件夹小图标，在打开对话框中选择要链接的文件，按"确定"键后在"属性"面板的链接栏中会显示链接的文件地址，在地址后面紧跟着输入＃号和锚名字。
关于html文件怎么创建锚点的介绍到此就结束了，不知道本篇文章是否对您有帮助呢？如果你还想了解更多此类信息，记得收藏关注本站，我们会不定期更新哦。
查看更多关于html文件怎么创建锚点 html设置锚点的详细内容...