网页超链接怎么做,添加超链接网址的的详细步骤


此系列教程主要讲解HTML从基础到精通。自己能够设计一个完整的前端网页项目。

HTML学习复习05-在网页中加入图片和超链接,大学生变大神

程序员写代码


在HTML中添加图片其实很简单,就是添加一个img的标签。

HTML学习复习05-在网页中加入图片和超链接,大学生变大神

图片标签的语法

一般有src、alt、width、height四种属性就够用了。

效果:

HTML学习复习05-在网页中加入图片和超链接,大学生变大神

图片的显示效果

图片路径的写法

src表示的是图片的路径,这里面的值应该怎么写呢?

(1)html文件和图片在相同一个文件夹下。

HTML文件和图片文件在相同的目录下,可以直接书写文件的名称。

HTML学习复习05-在网页中加入图片和超链接,大学生变大神

写文件名的写法,如上面的HTML

(2)图片在HTML文件所在目录的文件夹内:

如图:

HTML学习复习05-在网页中加入图片和超链接,大学生变大神

图片文件在文件夹内

此时需要加上文件夹名称,并加上“/”表示下层目录:

HTML学习复习05-在网页中加入图片和超链接,大学生变大神

下层目录的图片写法

(3)图片文件在上层目录

如果图片在HTML文件所在的上层目录,则需要写“..”表示向上一级。如图:

HTML学习复习05-在网页中加入图片和超链接,大学生变大神

上层目录


超链接

超链接就是可以链接到某个资源的东西,比如我们打开百度首页搜索后,产生的就是超链接:

HTML学习复习05-在网页中加入图片和超链接,大学生变大神

这些蓝字超链接

这些蓝色的文字标题,我们点击之后可以跳转到新的网站。这就是超链接。下面我们自己写一个超链接:

HTML学习复习05-在网页中加入图片和超链接,大学生变大神

超链接的写法

HTML学习复习05-在网页中加入图片和超链接,大学生变大神

超链接预览


超链接中的属性

超链接中的潮涌属性包括:href(网页地址)、title(说明描述)、target(打开网页的位置)、name(名称)。

其中href支持带有任何协议的连接。title是对超链接的说明。

HTML学习复习05-在网页中加入图片和超链接,大学生变大神

程序员

target包括四个值:

_blank

在新的窗口打开连接

_self

在当前窗口打开超链接

_parent

在父窗口打开超链接,这个后面会说,不常用

_top

在整个窗口中打开被链接文档。


每天一个知识点,带你迈向软件编程大神,一起努力吧。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发表评论

登录后才能评论