这是我参与「第五届青训营」伴学笔记创作活动的第 8 天。今天我们开始谈谈常用的HTML标签——超链接标签,请大家多多指教!
【超链接标签】
超链接是网页中常使用的元素,一个网站通常由多个页面构成,进入网站首选看到的是首页面,如果想从首页面跳转到子页面,就需要在首页面的相应位置添加超链接。
创建超链接的基本语法格式
<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>
在上述语法中,<a>标签是一个行内标签,用于定义超链接,href和target是<a>标签的常用属性,具体含义如下:
- href:href属性用于指定链接转向的页面的URL,当在
<a>标签中使用href属性时,该标签就具有了超链接的功能 - target:target属性用于指定页面的打开方式,其值有:
_self:默认值,表示在原窗口打开
_blank:表示在新窗口打开
_parent:表示在父框架集中打开被链接文档
_top:表示在整个窗口打开被链接文档
案例演示
下面用一个案例演示<a>标签的使用
<body>
在新窗口打开:
<a href="http://www.juejin.cn" target="_blank">掘金官网</a><br />
在原窗口打开:
<a href="D:\好看的\命韵峋环.jpg" target="_self">命韵峋环</a>
</body>
在核心代码中,使用<a>标签定义了两个超链接,其中“掘金官网”首页链接打开方式设置为在新窗口打开,"命韵峋环"图像链接的打开方式设置为在原窗口打开,使用浏览器打开,显示效果如下图所示
从图中可以看到有两个超链接,单击"掘金官网"链接后,页面跳转效果如下图所示
从图中可以看出,当单击"掘金官网"链接时,"掘金官网"首页在新窗口打开。关闭新窗口,回到原窗口在单击“命韵峋环”链接,页面跳转效果如下图所示
从图中可以看出,当单击“命韵峋环”链接后,“命韵峋环”图像会在原窗口打开
【小结】
今天学习了超链接标签的基本语法格式,并通过案例分析加以巩固。