HTML路径

  1. 路径指的是查找文件时,从起点到终点经历的路线。
  2. 路径分类:
  • 相对路径:从当前文件位置出发查找文件位置  使用场景:图片在自己的电脑里
  • 绝对路径:从盘符出发查找目标文件  应用场景:友情链接

        Windows电脑从盘符出发

        Mac电脑从根目录(/)出发

   3.在路径写法中,一下符号表示的含义:

     .  当前文件所在文件夹

    /  表示进入某个文件夹里面     

   ..  当前文件上一级文件夹

  4.代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>网页标题</title>
</head>
<body>
    <!-- 相对路径 使用场景:图片在自己的电脑里-->
    <!-- 1.jpg -->
   <img src="./1.jpg" alt="" width="200">

   <!-- 2.jpg -->
   <img src="./imgs/2.jpg" alt="" width="200">

   <!--3.jpg  图片在上级文件夹  -->
   <img src="../imgs/3.jpg" alt="" width="200">

   <!-- 绝对路径 应用场景:友情链接 -->
   <!-- 文件在自己的电脑里 -->
   <img src="C:\毕设图片\一般.png" alt="">

   <!-- 文件不在自己的电脑里 复制图片在线网址的方式找图片的位置-->
   <img src="https://i.hexuexiao.cn/up/f8/98/9d/6d56fbebd24177355962e92cc59d98f8.jpg.source.jpg" alt="" width="200">
</body>
</html>

 5.实现效果:

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值