Thẻ base trong HTML
Trần Thị Vân - 1618
- 09/07/2025
Chức năng của Thẻ base trong HTML
Thẻ base trong HTML dùng để nhúng tên miền chính của trang web, nếu thẻ img hoặc liên kết nào không chứa url tên miền chính thì thẻ này sẽ gắn tên miền đã nhúng vào những liên kết không có tên miền gốc đó.
Cú pháp của Thẻ base trong HTML
<base href="duongdanchinh" >
duongdanchinh: Đường dẫn chính để nối với các URL chưa nối tên miền (Ví dụ: https://webmoi.vn/)
Ví dụ thực tế Thẻ base trong HTML
<head>
<base href="https://webmoi.vn/" >
</head>
<body>
<img src="upload/tinblog/the-base-trong-html.jpg" width="526" height="274" alt="Thẻ base trong HTML">
<a target="_blank" href="the-base-trong-html/">Thẻ base trong HTML</a>
</body>
Ở đây mình để tên miền gốc trong thẻ base là https://webmoi.vn/, ở src của img và href của thẻ a mình không để url gốc, khi chạy thì thẻ base sẽ lấy url gốc để trong href gắn vào.
Những lưu ý quan trọng khi sử dụng thẻ base
Khai báo thẻ base trước các URL tương đối
Thẻ base nên được khai báo trước các phần tử sử dụng đường dẫn tương đối để trình duyệt xác định đúng địa chỉ gốc. Điều này giúp các liên kết và tài nguyên được phân giải chính xác ngay từ khi tải trang.
<base href="https://example.com/images/">
<img src="logo.png" alt="Logo">
Trong ví dụ trên, trình duyệt sẽ tìm hình ảnh theo đường dẫn https://example.com/images/logo.png.
Chỉ nên có một thẻ base trong mỗi tài liệu HTML
Một tài liệu HTML chỉ nên khai báo một thẻ base. Nếu xuất hiện nhiều thẻ, trình duyệt thường chỉ áp dụng giá trị của thẻ đầu tiên, khiến các khai báo phía sau không đạt hiệu quả như mong muốn.
Duy trì một thẻ duy nhất cũng giúp mã nguồn dễ bảo trì và hạn chế lỗi phát sinh khi cập nhật cấu trúc đường dẫn.
Ảnh hưởng của thẻ base đến liên kết nội bộ và tài nguyên
Khi được khai báo, thẻ base sẽ ảnh hưởng đến tất cả đường dẫn tương đối như liên kết, hình ảnh, tệp CSS, JavaScript và các tệp tải xuống. Chỉ cần thay đổi URL gốc, toàn bộ các đường dẫn tương đối trong trang cũng sẽ thay đổi theo.
Trước khi triển khai, nên kiểm tra kỹ các tài nguyên để tránh tình trạng liên kết bị lỗi hoặc không thể tải nội dung.
- Liên kết điều hướng.
- Hình ảnh.
- Tệp CSS.
- Tệp JavaScript.
- Tệp tải xuống.
Khi nào không nên sử dụng thẻ base
Không nên sử dụng thẻ base nếu website chủ yếu dùng đường dẫn tuyệt đối hoặc cấu trúc thư mục đơn giản. Trong các dự án có nhiều thư viện hoặc framework, việc thay đổi URL gốc cũng có thể khiến một số thành phần hoạt động không đúng nếu không được cấu hình phù hợp.
Chỉ nên áp dụng khi cần quản lý đồng bộ nhiều đường dẫn tương đối và đã hiểu rõ phạm vi ảnh hưởng của thẻ này.
Lời kết
Cảm ơn các bạn đã tham khảo bài viết Thẻ base trong HTML.
- 0 Bình luận
Email, Điện thoại của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *
