2.3图片及路径-高二《Web前端开发-网页设计》同步精品课堂（电工版2023）

单元2 HTML基础 2.3 图片及路径 PART 01 <img>标签 主要内容 CONTENTS PART 02 相对路径与绝对路径 2 <img>标签 <img src="path" alt="text" title="text" width="x" height="y" /> 图像地址 图像读取失败时的替代文字 鼠标悬停在图像上的提示文字 图像宽度 图像高度 <img> 是一个单标签。 【案例2.3.1】 <img>标签的使用 注意 绝对路径 本地绝对路径一般指从盘符开始，到文件名称结束。 例如：c:/project/images/banner.jpg 网络绝对路径指从网站的域名开始，到文件名结束，在使用时需要加上协议。 例如： http://i3.sinaimg.cn/blog/2022/0303/S129809T1414550868715.jpg 网页制作中，一般不使用绝对路径 注意 相对路径 ./ 表示同级目录； ./可以省略不写  ../ 表示上一级目录， ../../ 表示上两级目录，以此类推。 相对路径与绝对路径类似，不同的是在描述目录或文件路径时，所采用的参考点不同。绝对路径以域名或盘符为参考点，到文件名称结束；相对路径以当前文件位置为参考点，到文件名称结束。 相对路径的设置分为以下3种 （1）图像文件和html文件位于同一文件夹 <img src=”banner.jpg”/> （2）图像文件位于html文件的下一级文件夹images中 <img src=”images/banner.jpg”/> （3）图像文件位于html文件的上一级文件夹 <img src=”.. /banner.jpg”/> 感谢观看 $