HTML网页设计:四、超链接

HTML网页设计:四、超链接

超链接

HTML中通过使用标签来创建链接,当您把鼠标指针移动到网页中的某个链接上时,箭头会变为一只小手,点击相应的文本或图片会跳转至新的页面或者当前页面中的某个位置。

HTML系列文章目录

HTML网页设计:一、HTML的基本结构HTML网页设计:二、网页的基本标签HTML网页设计:三、图像标签之<img>标签HTML网页设计:四、超链接HTML网页设计:五、行内元素和块元素HTML网页设计:六、列表HTML网页设计:七、表格HTML网页设计:八、媒体元素HTML网页设计:九、网页的简单布局HTML网页设计:十、iframe内联框架HTML网页设计:十一、表单

文章目录

超链接HTML系列文章目录1.a标签2.锚链接(1)当跳转到当前页面的特定位置时,直接将锚标记设为href属性的值。(2)当跳转到另一个网页的特定位置时,将锚标记添加到链接地址的末尾。(3)当href属性的值为一个“#”时,直接跳转至本页面顶部。

3.功能性链接(1)邮箱链接(2)QQ链接

1.a标签

HTML 链接连接语法如下:

\Link text\

href属性规定链接的目标,是a标签的必须属性。target属性规定在何处打开链接文档。它有五个选项: (1)_blank:在新窗口中打开被链接文档。 (2)_self:默认。在相同的框架中打开被链接文档。 (3)_parent:在父框架集中打开被链接文档。 (4)_top:在整个窗口中打开被链接文档。 (5)framename:在指定的框架中打开被链接文档。name属性规定锚的名称,HTML5 中不支持。title属性说明了鼠标指针悬停所显示的文字。开始标签和结束标签之间的文字被作为超级链接来显示,即上面一行的代码显示为Link text。

标签的使用有如下两种方式:

(1)通过使用 href 属性 - >创建指向另一个文档的链接。 (2)通过使用 name 属性 - >创建文档内的书签。

一些简单的超链接代码示例如下:

简单的超链接合集

点击跳转至360浏览器页面


点击跳转图像标签学习页面


许嵩

网页示例如下:

2.锚链接

锚链接可以链接到本页面的特定位置,也可以链接到另一个页面的特定位置,其实现方式是添加锚标记。html5不支持name属性,以下用id属性示例,name属性用法大致一样。

(1)当跳转到当前页面的特定位置时,直接将锚标记设为href属性的值。

其代码格式如下:

跳转到本页面的标记处

(2)当跳转到另一个网页的特定位置时,将锚标记添加到链接地址的末尾。

其代码格式如下:

跳转到另一个页面的标记处

"#标记名"为页面中某一个标签的id属性值,即若想要跳转到网页的某个位置,就先在这个位置所在的标签设置id属性,然后才能通过锚链接跳转到该位置。

(3)当href属性的值为一个“#”时,直接跳转至本页面顶部。

其代码格式如下:

返回顶部

锚链接部分代码示例如下:

锚链接学习

点击跳转至360浏览器页面

许嵩

许嵩

点击跳转至百度页面

点击跳转至百度页面

点击跳转至百度页面

点击跳转至链接1

点击跳转至图片1

点击跳转至图片2

点击跳转至顶部

3.功能性链接

(1)邮箱链接

点击向我发送邮件

(2)QQ链接

需要在QQ推广里面加载生成链接 然后复制粘贴即可

相关尊享内容