เส้นทางไฟล์ HTML
เส้นทางของไฟล์อธิบายตำแหน่งของไฟล์ในโครงสร้างโฟลเดอร์ของเว็บไซต์
ตัวอย่างเส้นทางไฟล์
เส้นทาง | คำอธิบาย |
---|---|
<img src="picture.jpg"> | ไฟล์ "picture.jpg" อยู่ในโฟลเดอร์เดียวกับหน้าปัจจุบัน |
<img src="images/picture.jpg"> | ไฟล์ "picture.jpg" อยู่ในโฟลเดอร์รูปภาพในโฟลเดอร์ปัจจุบัน |
<img src="/images/picture.jpg"> | ไฟล์ "picture.jpg" อยู่ในโฟลเดอร์รูปภาพที่รูทของเว็บปัจจุบัน |
<img src="../picture.jpg"> | ไฟล์ "picture.jpg" อยู่ในโฟลเดอร์หนึ่งระดับจากโฟลเดอร์ปัจจุบัน |
เส้นทางไฟล์ HTML
เส้นทางของไฟล์อธิบายตำแหน่งของไฟล์ในโครงสร้างโฟลเดอร์ของเว็บไซต์
เส้นทางของไฟล์ถูกใช้เมื่อเชื่อมโยงกับไฟล์ภายนอก เช่น:
- หน้าเว็บ
- รูปภาพ
- สไตล์ชีต
- JavaScripts
เส้นทางไฟล์แอบโซลูท
เส้นทางของไฟล์แบบสัมบูรณ์คือ URL แบบเต็มไปยังไฟล์:
ตัวอย่าง
<img src="https://www.w3schools.com/images/picture.jpg"
alt="Mountain">
แท็ก <img> อธิบายไว้ในบท: รูปภาพHTML
เส้นทางไฟล์สัมพัทธ์
พาธไฟล์แบบสัมพันธ์ชี้ไปที่ไฟล์ที่สัมพันธ์กับเพจปัจจุบัน
ในตัวอย่างต่อไปนี้ พาธของไฟล์ชี้ไปที่ไฟล์ในโฟลเดอร์รูปภาพซึ่งอยู่ที่รูทของเว็บปัจจุบัน:
ตัวอย่าง
<img src="/images/picture.jpg"
alt="Mountain">
ในตัวอย่างต่อไปนี้ พาธของไฟล์ชี้ไปที่ไฟล์ในโฟลเดอร์รูปภาพที่อยู่ในโฟลเดอร์ปัจจุบัน:
ตัวอย่าง
<img src="images/picture.jpg"
alt="Mountain">
ในตัวอย่างต่อไปนี้ พาธของไฟล์ชี้ไปที่ไฟล์ในโฟลเดอร์รูปภาพที่อยู่ในโฟลเดอร์หนึ่งระดับจากโฟลเดอร์ปัจจุบัน:
ตัวอย่าง
<img src="../images/picture.jpg"
alt="Mountain">
ปฏิบัติที่ดีที่สุด
แนวทางปฏิบัติที่ดีที่สุดคือการใช้เส้นทางไฟล์แบบสัมพัทธ์ (ถ้าเป็นไปได้)
เมื่อใช้เส้นทางไฟล์แบบสัมพันธ์ หน้าเว็บของคุณจะไม่ถูกผูกไว้กับ URL ฐานปัจจุบันของคุณ ลิงก์ทั้งหมดจะทำงานบนคอมพิวเตอร์ของคุณเอง (localhost) เช่นเดียวกับโดเมนสาธารณะในปัจจุบันและโดเมนสาธารณะในอนาคตของคุณ