HTML链接
时间:2020-02-23 14:33:41 来源:igfitidea点击:
HTML链接或者超链接是一些文本和图像,单击它们可以将我们带到其他网页文件。
锚标签
我们使用定位标记" <a>"创建HTML链接。
上面的HTML入门教程链接是通过编写以下HTML代码创建的。
<a href="https://www.theitroad.local/html/html-introduction">Click Me! To check HTML Introduction</a>
锚标记的href
属性设置为我们要重定向的网页的url。
目标属性
锚标记具有名为" target"的属性,该属性告诉我们链接文档将在何处打开。
以下是target属性的一些值。
_blank
这将在新窗口中打开链接的网页文档。
<a href="/html/html-introduction" target="_blank">Click Me! To check HTML Introduction</a>
_self
将在同一页面中打开链接的网页文档。
<a href="/html/html-introduction" target="_self">Click Me! To check HTML Introduction</a>
parent
将在父框架中打开链接的网页文档。
<a href="/html/html-introduction" target="_parent">Click Me! To check HTML Introduction</a>
_top
将在整个窗口中打开链接的网页文档。
<a href="/html/html-introduction" target="_top">Click Me! To check HTML Introduction</a>
滚动到顶部-部分链接
我们可以使用锚标记来创建链接,单击这些链接可以将我们带到网页的不同部分。
一个常见的示例是网页中的"滚动到顶部"链接,用户在文档中向下滚动太远后,单击该链接可滚动回到顶部。
要创建节链接,我们需要两个锚标记。
第一个标签放置在我们要带用户前往的部分中。
第一个锚点的"名称"属性设置为第二个标记中使用的某个值。
第二个锚点是链接,单击该链接会将用户带到目标部分。
该锚点的属性" href"具有" #name",其中name等于第一个锚点中使用的值。
例
</code><h1>Top of the page</h1> <a name="top"></a> <p>Some text in this paragraph... </p> <a href="#top">Scroll To Top</a> </code>
链接下载文件
我们可以通过将锚标记的href属性设置为文件的URL来创建下载文件的链接。
<a href="http://www.example.com/download/doc.pdf">Download PDF</a>
我们可以使用它为PDF,CSV,DOC,PSD等文件创建下载链接。
图片链接
我们还可以通过将图像标签" <img>"放在锚标签" <a>"内来建立图像链接。
<a href="https://www.theitroad.local"> <img alt="Brand" src="https://www.theitroad.local/image/theitroad-logo-black-311x48.png"> </a>