前端基础入门（6）超链接

最新推荐文章于 2024-08-07 08:51:08 发布

前端奇妙妙

最新推荐文章于 2024-08-07 08:51:08 发布

阅读量1.4k

点赞数

分类专栏： IT web前端程序员编程资讯科技 JavaScript vue 框架文章标签：程序员编程 web前端资讯科技

本文链接：https://blog.csdn.net/fenghulun/article/details/91348109

版权

本文详细介绍了超链接在网页中的应用，包括文字链接的`href`和`target`属性，如何创建锚点链接以实现内部页面跳转，以及通过CSS对超链接进行样式设置，如不同状态下的链接样式。此外，还提供了实例代码和学习资源，帮助初学者掌握超链接的使用。

摘要由CSDN通过智能技术生成

超链接–文字链接
超链接【hyperlink】是网页中最为常见的元素之一，我们几乎可以在所有的网站页面中找到超链接。每个网站都不止一个页面，这些页面就是利用超链接进行串接。超链接帮我们实现了网页与网页之间的跳转。

文字链接：我们可以使用超链接标签<a><a/>实现文字链接。设置了链接的文字默认样式为蓝色文字，有下划线。<a><a/>标签实现超链接有两个属性需要设置：

? href属性：表示点击该超链接将要跳转到的页面地址，该地址可以是当前页面的相对地址，也可以直接跳转到另外一个网站。

? target属性：该属性设置超链接页面的打开方式。target属性有四个取值，这里，只说明常用的两个，【_self】是默认值，表示在浏览器当前窗口打开超链接的页面，【_blank】表示新建一个空白浏览器窗口，在新的窗口打开超链接页面。

来个例子看看：新建三个HTML页面文件，网页1里面设置三个超链接，分别链接到百度、网页2、网页3。

网页一代码：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
</head>
<body>
    <!--第一个超链接，链接到百度，在浏览器新的窗口打开-->
    <a href&#