HTML中的路径

介绍

在HTML中，路径用于引用外部文件，例如图像、样式表、脚本和链接页面等。路径可以是相对路径或绝对路径。

相对路径指文件与当前网页相对位置的路径。绝对路径指文件的全路径。

相对路径

相对路径的语法

相对路径的语法是以当前网页所在的目录作为起始点，根据文件位置计算出引用文件的路径。相对路径有两种形式：

• 相对于当前目录： ./ 代表当前目录，../代表上一级目录。

• 相对于根目录：以 /开头，例如 /images/logo.png，代表根目录下的 images 目录下的 logo.png 文件。

相对路径示例

引用同一目录下的文件

如果一个HTML文件和一个图像文件在同一个目录下，可以使用下面这条语句来引用图像文件：

<img src="picture.jpg" alt="A beautiful picture">

引用上一级目录中的文件

如果想要访问上一级目录中的文件，可以使用相对路径 ../来访问。例如，假设一个HTML文件和图像文件在不同的目录，HTML 文件在上一级目录中，则可以使用以下语句来引用图像文件：

<img src="../images/picture.jpg" alt="A beautiful picture">

引用同级目录中的子目录

访问同级目录中的子目录，可以像访问文件一样使用相对路径。例如，如下语句将会引用位于同级目录下的一个名为 images 的子目录中的 picture.jpg 文件：

<img src="images/picture.jpg" alt="A beautiful picture">

绝对路径

绝对路径基于文件在服务器的位置而不是文件相对于当前网页的位置。它是从根目录开始构建的完整路径。

绝对路径适用于服务器上的文件，所以在本地环境下不常用。在使用绝对路径时，URL中必须指定协议（HTTP或HTTPS）。例如：

<img src="https://example.com/picture.jpg" alt="A beautiful picture">

总结

路径包括相对路径和绝对路径。相对路径是以当前网页所在的目录为起点的相对位置，而绝对路径是从根目录开始的完整路径。相对路径以 ./ 和 ../ 开头，代表当前目录和上一级目录。相对路径适用于本地环境和服务器环境。