HTML中的路径解析：相对路径与绝对路径解析

需积分: 50 164 浏览量更新于2024-08-13 收藏 2.46MB PPT 举报

"这篇文档主要介绍了HTML中的相对路径和绝对路径概念，并且提及了不同HTML版本的DOCTYPE声明，同时还涉及到网页优化的DNS预取链接、元标签设置以及图像格式（PNG、JPG、GIF）的选择与兼容性问题。此外，还简要提到了图像地图的使用方法。" 在Web开发中，路径是定位文件或资源的关键。**相对路径** 是相对于当前文件的路径，它不包含完整的URL，而是基于当前文档位置来指向其他文件。例如，如果当前HTML文件在一个名为"images"的文件夹中，要链接到该文件夹内的一个图片，可以使用"../"返回上一级目录，然后指定图片名称，如"../image.png"。相对路径方便于文件组织和移动，但可能在链接层次复杂时导致混乱。相反，**绝对路径** 包含完整的URL，从根目录开始直到目标文件，它提供了明确的定位，不受当前文档位置影响。例如，"http://example.com/images/image.png"是一个绝对路径。绝对路径在链接外部资源或确保所有用户都能准确找到资源时非常有用。文档中提到了不同HTML版本的DOCTYPE声明，这是用来告诉浏览器文档遵循的HTML或XHTML规范。例如，HTML5的DOCTYPE声明是`<!DOCTYPE html>`，简洁明了，而HTML4.01和XHTML1.0的声明则更为复杂，如`<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">`。在网页优化方面，文档提到了`<link rel="dns-prefetch">`标签，这是用来预加载DNS记录，提高页面加载速度。例如，`<link rel="dns-prefetch" href="http://mimg.126.net">`将提前解析126.net的域名。关于图像格式，PNG、JPG和GIF各有特点。**PNG** 支持透明和丰富的色彩，但文件大小通常较大；**JPG** 适合存储照片或色彩丰富的图像，有较好的压缩比但不支持透明；**GIF** 支持透明和动画，但颜色有限（256色），文件大小介于PNG和JPG之间。需要注意的是，旧版IE6对PNG的透明支持存在问题。最后，文档还展示了如何使用HTML的`<map>`元素创建**图像地图**，允许将图像的不同区域链接到不同的URL。例如，`<area shape="poly" coords="..." href="...">`定义了一个多边形区域，用户点击该区域将跳转到指定URL。这篇文档涵盖了Web开发中基础的路径概念、DOCTYPE声明、网页优化策略以及图像处理和交互设计的一些要点。

顾阑

粉丝: 15
资源: 2万+

HTML中的路径解析：相对路径与绝对路径解析

前端学习笔记-黑马程序员

黑马程序员入学面试题

程序员web前端视频教程（文档+代码+视频）.rar

综合练习—-黑马财富

黑马web前端vue

黑马点评项目前端代码

魔百盒cm201-2-ch-hi3798mv300-300h-emmc和nand通刷-红外蓝牙黑马语音-免拆和救砖

黑马tlias接口文档

javaee企业级应用开发教程黑马程序员编著pdf

b站子木的python和黑马的课哪个好

最新资源