Xác định nơi bắt đầu trước khi viết đường dẫn
Hình mô tả bộ tệp dùng trong các bài tiếp theo. Trong bộ này, đường dẫn tương đối bắt đầu từ thư mục chứa tệp đang có liên kết. Các cấp thư mục được ngăn bằng dấu `/`.
Ví dụ, từ index.html ở ngoài, vào hoat_dong rồi mở lich.html. Khi đang ở lich.html, muốn về index.html phải đi lên một cấp trước.
Đọc từng bước đi trong đường dẫn
| Tệp đang chứa liên kết | Giá trị href | Đích |
|---|---|---|
| index.html |`thong_tin.html`|Tệp cùng thư mục|
| index.html |`hoat_dong/lich.html`|Tệp trong thư mục con|
| index.html |`hoat_dong/tu_lieu/noi_quy.html`|Tệp dưới hai cấp|
| hoat_dong/lich.html |`../index.html`|Lên một cấp về trang chủ|
| hoat_dong/tu_lieu/noi_quy.html |`../../index.html`|Lên hai cấp về trang chủ|
`../` đi lên một cấp; `./` vẫn là thư mục hiện tại. Trong bộ này, `./thong_tin.html` và `thong_tin.html` từ index.html cùng trỏ một tệp. Không bỏ dấu chấm thứ hai của `../` khi cần đi lên.
Từ trang chủ tới ba tài liệu
```html
<ul>
<li><a href="thong_tin.html">Thông tin nhóm</a></li>
<li><a href="hoat_dong/lich.html">Lịch riêng</a></li>
<li><a href="hoat_dong/tu_lieu/noi_quy.html">Nội quy mẫu</a></li>
</ul>
```
Mỗi li chứa một a. Nội dung giữa hai thẻ a là nhãn; href dẫn tới tệp theo cây thư mục. Nếu chuyển nguyên thư mục mẫu sang nơi khác mà giữ cấu trúc bên trong, các đường dẫn tương đối này vẫn có thể dùng được.
Nếu chỉ chuyển một tệp mà để các tài nguyên ở chỗ cũ, cần kiểm lại quan hệ thư mục. Giữ đúng tên và phần mở rộng; một số máy chủ phân biệt chữ hoa với chữ thường.
Bài luyện
Từ index.html, href nào mở tệp lich.html theo cây mẫu?
lich.html không nằm cùng thư mục với index.html.
Đi lên một cấp không dẫn vào hoat_dong.
Đúng. Đi vào hoat_dong rồi tới lich.html.
Cây mẫu không đặt lich.html trong tu_lieu ở cấp đó.
Lời giải
index.html nằm ở thư mục gốc mẫu. Tệp đích ở trong hoat_dong, nên ghép tên thư mục con rồi tên tệp bằng dấu gạch chéo: hoat_dong/lich.html.
Bài luyện
Đang ở hoat_dong/lich.html, muốn về index.html ở thư mục cha. href nào đúng?
Đúng. ../ lên một cấp rồi tìm index.html.
./ giữ nguyên thư mục hoat_dong.
Đường dẫn này đi vào thư mục con hoat_dong từ nơi hiện tại.
Tên tệp đơn lẻ được tìm trong thư mục hiện tại.
Lời giải
Thư mục chứa lich.html là hoat_dong. ../ đưa việc tìm tệp về thư mục cha của hoat_dong, nơi có index.html; ./ hoặc tên tệp đơn lẻ vẫn tìm ở thư mục đang đứng.
Bài luyện
Từ hoat_dong/tu_lieu/noi_quy.html, cần mấy cụm ../ để về index.html ở gốc mẫu?
Không đi lên sẽ tìm ở tu_lieu.
Đúng. Lên từ tu_lieu tới hoat_dong rồi tới gốc mẫu.
Một cụm mới đưa tới hoat_dong.
Ba cụm đi cao hơn thư mục gốc mẫu.
Lời giải
Tệp hiện tại nằm dưới tu_lieu, mà tu_lieu nằm dưới hoat_dong. Cần hai lần lên cấp, nên dùng ../../index.html để tới index.html của mẫu.
Bài luyện
Trong bộ mẫu, ./ có ý nghĩa nào?
Hai cấp lên trên được viết ../../.
./ không chỉ website ngoài.
./ không tự thay tên tệp.
Đúng. ./ khác ../ ở bước đi thư mục.
Lời giải
./ chỉ thư mục hiện tại, còn ../ chỉ thư mục cha. Vì vậy ./thong_tin.html từ index.html tìm thong_tin.html cùng thư mục, không tự đi lên hoặc đổi tên tệp.
Đang học