链接和锚标签之间的区别
HTML 语言是 Web 开发中最基本的组件。如果您是 Web 开发的初学者，学习 HTML，那么您一定已经发现了“链接”和“ a”标签。这两个实体 和 用于某种链接，所以如果您对它们感到困惑或想了解它们之间的实际区别，那么您来对地方了。在本文中，我们将区分它们，然后是实际定义以及两者的示例。
标签：该标签用于在当前文档和与网页相关联的一些外部资源之间建立连接/关系。资源可以是 CSS 文件、站点中使用的图标、清单等。
它具有某些属性，其中一些最常用的如下。
Attribute_Name=”Value” Example Descriptionhref=”URL” href=”../externalStyle.css” It specifies the location
of the resource.media=”media_query/media_type” media=”screen and (min-width: 700px)” It is used to define on what device
the linked document will be displayed.rel=”relationship_with_resource” rel=”stylesheet”
rel=”license”
rel=”icon”It specifies which kind of resource
is being associated with this tag.size=”HeightxWidth” size=”32×32″ It is mainly used for icons to link
the resource with specified size.type=”MIME_TYPE” type=”image/png”
type=”text/html”This attribute is used to define the
MIME-type of linked content.
示例 1：在我们的文档中创建指向某些外部 CSS 样式表的链接。赋予 h2 标签的 id 仅包含外部 CSS 文件中的样式颜色：绿色。
Javascript
Link Tag
Hello, GeeksforGeeks Learner
The above text is having color
green instead of default black,
because a file which contains
some css code is associated/linked
with this document.
Javascript
Link Tag
// Add png image source here
The Favicon being displayed
along with text in title is
because a png file is associated
/linked with this document
HTML
Anchor Tags
GeeksforGeeks
5th Floor, A-118,
Sector-136,
Noida, Uttar Pradesh - 201305
feedback@geeksforgeeks.org
Video Tutorials
Call Us
输出：
示例 2：为网站添加一些外部网站图标。
Javascript
Link Tag
// Add png image source here
The Favicon being displayed
along with text in title is
because a png file is associated
/linked with this document
输出：
标记：此锚标记建立到 HTML 的外部或内部文档、电子邮件或电话等地址以及某种外部 URL 地址的超链接。
- 一些常用的属性是：-
Attribute_Name=”Value” | Example | Description |
|---|---|---|
| href=”URL” | href=”https://www.geeksforgeeks.org” href=”../filePath.ext” href=”#someInternalId” | It specifies the location of the hyperlink. |
| target=”some_browsing_context” | target=”_blank” target=”_self” | It specifies where to display the linked URL. |
| download=”filename.ext” | download=”linkedImage.png” | This is used to download the content of the hyperlink instead of just a visit. |
| ping=”URL” | ping=”https://someUrl/postRequest” | It sends the post request to the provided URL and is mainly used for tracking purposes. |
笔记： 链接标签中描述的rel和type属性也可以与锚标签一起使用。
示例 1：我们将绘制geeksforgeeks.org的页脚的基本克隆，以说明锚标记的用例，您一定已经看过很多次了，因此对于实际示例，它可能是一个更好的选择。
解释：-
- 第一个anchor标签引用了GFG官网，还有一个属性target，设置为一个值_blank表示这个超链接会在另一个标签页中打开。
- 下一个锚标记是传递 GFG 邮件的超链接。它的语法是“ mailto: any_mail_id_will_appear_here ” ，当用户点击这个标签时，浏览器会打开一些默认的应用程序来发送邮件。
- 后来有一个 GFG 的 YouTube 频道的链接，注意第一个和这个的区别，它没有目标属性，所以默认情况下它会在同一个选项卡中打开。
- 最后，有一个用于拨打电话的超链接，它接受冒号后带有国家代码的号码，即“ tel: any_telephone_number ，与此处的邮件超链接类似，浏览器也将决定使用哪个应用程序进行通话。
HTML
Anchor Tags
GeeksforGeeks
5th Floor, A-118,
Sector-136,
Noida, Uttar Pradesh - 201305
feedback@geeksforgeeks.org
Video Tutorials
Call Us
输出：-
标签之间的区别 和标签： Tag 1. This tag is used inside the head section. This tag is used inside the body section. 2. It is not displayed on the front end and is just used for internal purposes. The content written inside the anchor tag gets displayed in the frontend. 3. It establishes the relationship/connection between two entities. It establishes a path from the current document to somewhere else. 4. Because of not directly visible to the user it is not clickable. Users can click on the content enclosed inside this tag to visit the hyperlink. 5. It is an empty element and can’t have nested elements. It is not an empty element, it can have some nested elements inside. 6. It has nothing to do with the block or inline properties of HTML elements. It is an inline HTML element. 7. The basic structure of this tag is,
some_attributes_with_value />The basic structure of this tag is,
some_attributes_with_value > some_nested_content