html_3_img标签_相对路径_绝对路径

最新推荐文章于 2024-05-17 17:20:46 发布

CN_山居

最新推荐文章于 2024-05-17 17:20:46 发布

阅读量2k

点赞数

分类专栏： HTML 文章标签： html

本文链接：https://blog.youkuaiyun.com/Kemperorster/article/details/121512188

版权

6 篇文章

订阅专栏

本文介绍了HTML中的<img>标签用于插入图片，并详细讲解了绝对路径和相对路径的概念与用法。绝对路径提供文件在硬盘上的完整路径，而相对路径则基于当前文件的位置。绝对路径在防止抄袭和保持链接有效性方面有优势，但编写时较复杂；相对路径移动内容方便，但在页面位置改变时可能导致链接失效。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

img标签

图片标签，在页面显示一个图片

语法：

<img src="图片路径" alt="当图片显示失败时的文字" title="当光标悬浮在图片上时显示的文字" width="设置图片宽度" height="设置图片高度"/>

ps：width和height的值可以不带例如px或em的单位，当只设置其中一个属性时，另外一个会自动等比缩放

举个栗子：找到文件，右键点击后打开属性，我把喜欢的封面’cover1.jpg’储存在了路径_C:\Users\80975\OneDrive\Desktop\cover_
那么C:\Users\80975\OneDrive\Desktop\cover\cover1.jpg 就是绝对路径

<!-- 用 / 或 \ 都可以 -->
<img src="C:\Users\80975\OneDrive\Desktop\cover\cover1.jpg" alt="cover1">

以下为建立路径所使用的几个特殊符号，及其所代表的意义。

"./"：代表目前所在的目录。

"…/"：(两个点)代表上一层目录。

以"/"开头：代表根目录。

优缺点：

1、绝对路径的优点

A、如果有人抄袭你的网站内容，里面的链接还会指向你的网站，有些抄袭的人比较懒，根本不会去改内容。其实也不局限于被抄袭，如果有人将你的网页保存到本地电脑中，里面的链接、图片、css、以及js仍然会连接到你的网站。

B、如果网页位置改变，里面的链接还是指向正确的URL。

2、绝对路径的缺点：

A、在编码编写时不方便使用绝对路径，因为链接应该指向真正的域名而不是开发站点。

相对路径的优缺点和绝对路径几乎相反。

3、相对路径的优点：

A、容易移动内容，可以整个目录移动。

B、测试方法比较灵活，本机测试时比较方便。

4、相对路径的缺点：

A、部分内容页面换了位置时，链接容易失效。

B、容易被人大面积采集抄袭。