مسیر فایل ها (File Paths)
مسیر فایل (File Path) آدرس فایل در پوشه هاست. مثل آدرس کلاس در مدرسه؛ با آن می گویی فایل کجاست تا مرورگر پیدایش کند.
مسیر فایل در HTML چیست؟
از مسیر فایل برای لینک دادن به تصاویر، صفحات، استایل ها و اسکریپت ها استفاده می کنیم. اگر آدرس درست نباشد، فایل لود نمی شود.
نمونه: همان پوشه، زیرپوشه، ریشه، یک پوشه بالاتر
این نمونه ها رایج اند. اولی همان پوشه، دومی زیرپوشه، سومی ریشه سایت، چهارمی یک پوشه بالاتر است.
<img src="picture.jpg" alt="Same folder">
<img src="images/picture.jpg" alt="Subfolder">
<img src="/images/picture.jpg" alt="Root folder">
<img src="../picture.jpg" alt="One level up">
مسیر مطلق (Absolute Path)
مسیر مطلق، آدرس کامل با پروتکل و دامنه است. مثل آدرس کامل خانه با شهر و خیابان.
<img src="https://www.w3schools.com/images/picture.jpg" alt="Mountain">
مسیر نسبی (Relative Path)
مسیر نسبی نسبت به صفحه فعلی سنجیده می شود. مثل گفتن «کلاس کنار کلاس ما».
<img src="/images/picture.jpg" alt="From site root">
<img src="images/picture.jpg" alt="From current folder">
<img src="../images/picture.jpg" alt="One level up">
بهترین تمرین ها
- تا می شود مسیر نسبی بزن.
- ساختار پوشه ها را تمیز نگه دار.
- حساسیت به اسامی را جدی بگیر.
- در ریشه، از "/" شروع کن.
گام های تمرینی
- یک پوشه images بساز.
- سه تصویر آزمایشی قرار بده.
- با چهار الگو بالا آدرس بده.
نکته: "." یعنی همین پوشه؛ ".." یعنی یک پوشه بالاتر.
مسیرهای مرتبط در درس های دیگر
برای بارگذاری اسکریپت ها به جاوااسکریپت (JavaScript) سر بزن. برای درج تصویرها، صفحه تصاویر (Images) را ببین. همچنین پیوند مسیر فایل ها (File Paths) را نگه دار.
جمع بندی سریع
- مطلق: آدرس کامل با دامنه.
- نسبی: نسبت به صفحه فعلی.
- "/" از ریشه سایت شروع می کند.
- ".." یک پوشه بالاتر می رود.
- ترجیح با مسیر نسبی است.