Đường dẫn tệp trong HTML

Đường dẫn tệp trong HTML

Giới thiệu

Đường dẫn tệp trong HTML mô tả vị trí của một tệp trong cấu trúc thư mục của một trang web.


Các ví dụ về đường dẫn tệp

Đường dẫnMô tả
<img src=”picture.jpg”>picture.jpg được đặt trong cùng một thư mục với trang hiện ta
<img src=”images/picture.jpg”>picture.jpg được đặt trong thư mục hình ảnh trong thư mục hiện tại
<img src=”/images/picture.jpg”>picture.jpg được đặt trong thư mục hình ảnh tại thư mục gốc của trang web hiện tại
<img src=”../picture.jpg”>picture.jpg được đặt trong thư mục tăng một cấp tính từ thư mục hiện tại

Các đường dẫn tệp HTML

Đường dẫn tệp được sử dụng để liên kết các tệp bên ngoài như:

  • Các trang web
  • Các hình ảnh
  • Stylesheet
  • JavaScript

Đường dẫn tuyệt đối

Một đường dẫn tuyệt đối là một URL đầy đủ đến một tệp:

<img src="https://www.w3schools.com/images/picture.jpg" alt="Mountain">

Đường dẫn tương đối

Một đường dẫn tương đối trỏ đến một tệp tin liên quan đến trang hiện tại.

  • Đường dẫn tệp trỏ đến một tệp trong thư mục hình ảnh được đặt ở thư mục gốc của trang web hiện tại:
<img src="/images/picture.jpg" alt="Mountain">
  • Đường dẫn tệp trỏ đến một tệp trong thư mục hình ảnh được đặt ở thư mục hiện tại:
<img src="images/picture.jpg" alt="Mountain">
  • Đường dẫn tệp trỏ đến một tệp trong thư mục hình ảnh được đặt ở thư mục có cùng cấp với thư mục hiện tại:
<img src="../images/picture.jpg" alt="Mountain">

Lưu ý

  • Đừng quên sử dụng URL, tên file, tên hình ảnh đúng cách, nếu không các yếu tố này sẽ không hiển thị trên trang web.
  • Sử dụng đường dẫn file tương đối để mã độc lập với URL.

Kết luận

Qua đây là một số chia sẻ về đường dẫn tệp trong HTML, mời bạn tiếp tục theo dõi các bài viết sau để hiểu rõ hơn về HTML.

Các bạn có thể tham khảo các bài viết hay về HTML tại đây.


Hãy tham gia nhóm Học lập trình để thảo luận thêm về các vấn đề cùng quan tâm.

CodeGym Full-stack

Leave a Reply

Your email address will not be published. Required fields are marked *