HTML File Paths
File paths tell the browser where to find linked resources like images, stylesheets, and scripts. Paths can be absolute (full URL) or relative (based on the current file's location).
Relative paths use ./ for the current folder and ../ to move up one directory level, making websites portable across different domains or folder structures.
<img src="images/photo.jpg">Absolute paths
An absolute path is a complete URL like https://example.com/images/logo.png, working regardless of where the current page is hosted.
Relative paths
A relative path like images/logo.png or ../css/style.css is resolved relative to the current HTML file's location, ideal for local project resources.
<img src="https://example.com/logo.png" alt="Logo">(loads logo from full URL)An absolute path always points to the same resource regardless of hosting location.
<link rel="stylesheet" href="../css/style.css">(loads a stylesheet one folder up in css/)../ moves up one directory level from the current file's folder.
Key points
- Absolute paths include the full URL (https://...).
- Relative paths are based on the current file's location.
- ./ refers to the current folder, ../ moves up one level.
- Relative paths make sites portable across environments.