Bắt hình ảnh hiển thị đúng cách
Bất kỳ hình ảnh nào bạn muốn liên kết trong HTML của trang web trước tiên phải được tải lên cùng một vị trí bạn gửi HTML cho trang web, cho dù trang web được lưu trữ trên máy chủ web mà bạn truy cập bằng FTP hoặc bạn sử dụng dịch vụ lưu trữ web. Nếu bạn sử dụng dịch vụ lưu trữ web, bạn có thể sử dụng biểu mẫu tải lên do dịch vụ cung cấp. Các biểu mẫu này thường nằm trong phần quản trị của tài khoản lưu trữ của bạn.
Tải hình ảnh của bạn lên dịch vụ lưu trữ chỉ là bước đầu tiên. Sau đó, bạn cần phải thêm một thẻ trong HTML để xác định nó.
Tải hình ảnh lên cùng thư mục dưới dạng HTML
Ảnh của bạn có thể nằm trong cùng thư mục với HTML. Nếu đó là trường hợp:
- Tải hình ảnh lên thư mục gốc của trang web của bạn.
- Thêm thẻ hình ảnh vào HTML của bạn để trỏ tới hình ảnh.
- Tải tệp HTML lên thư mục gốc của trang web của bạn.
- Kiểm tra tệp bằng cách mở trang trong trình duyệt web của bạn.
Thẻ hình ảnh có định dạng sau:
Giả sử bạn đang tải lên ảnh của mặt trăng có tên "lunar.jpg", thẻ hình ảnh có dạng sau:
Chiều cao và chiều rộng là tùy chọn nhưng được khuyến nghị. Lưu ý rằng thẻ hình ảnh không yêu cầu thẻ đóng.
Nếu bạn đang liên kết đến một hình ảnh trong tài liệu khác, hãy sử dụng các thẻ neo và lồng thẻ hình ảnh bên trong.
Tải lên hình ảnh trong thư mục con
Việc lưu trữ hình ảnh trong thư mục con thường được gọi là Hình ảnh phổ biến hơn. Để trỏ đến các hình ảnh trong thư mục đó, bạn cần biết vị trí của nó liên quan đến thư mục gốc của trang web của bạn.
Gốc của trang web của bạn là nơi URL, không có bất kỳ thư mục nào ở cuối, hiển thị. Ví dụ: đối với trang web có tên "MyWebpage.com", thư mục gốc sẽ theo sau biểu mẫu này: http://MyWebpage.com/. Chú ý dấu gạch chéo ở cuối. Đây là cách thư mục gốc của một thư mục thường được chỉ định. Thư mục con bao gồm dấu gạch chéo đó để hiển thị vị trí chúng nằm trong cấu trúc thư mục. Trang web ví dụ MyWebpage có thể có cấu trúc:
http://MyWebpage.com/ - thư mục gốc http://MyWebpage.com/products/ - thư mục sản phẩm http://MyWebpage.com/products/documentation/ - thư mục tài liệu trong thư mục sản phẩm http: // MyWebpage.com/images/ - thư mục hình ảnhTrong trường hợp này, khi bạn trỏ đến hình ảnh của mình trong thư mục hình ảnh, bạn viết:
Đây được gọi là đường dẫn tuyệt đối cho hình ảnh của bạn.
Các vấn đề thường gặp với hình ảnh không hiển thị
Bắt hình ảnh để hiển thị trên trang web của bạn có thể là thử thách lúc đầu. Hai lý do phổ biến nhất là hình ảnh không được tải lên nơi HTML đang trỏ hoặc HTML được viết không chính xác.
Điều đầu tiên cần làm là xem bạn có thể tìm thấy hình ảnh của mình trực tuyến hay không. Hầu hết các nhà cung cấp dịch vụ lưu trữ có một số loại công cụ quản lý mà bạn có thể sử dụng để xem nơi bạn đã tải lên hình ảnh của mình. Sau khi bạn nghĩ rằng bạn có URL chính xác cho hình ảnh của mình, hãy nhập URL đó vào trình duyệt của bạn. Nếu hình ảnh hiển thị, thì bạn có vị trí chính xác.
Sau đó kiểm tra xem HTML của bạn có trỏ đến hình ảnh đó không. Cách dễ nhất để làm điều đó là dán URL hình ảnh mà bạn vừa kiểm tra vào thuộc tính SRC. Tải lên lại trang và thử nghiệm.
Thuộc tính SRC của thẻ hình ảnh của bạn sẽ không bao giờ bắt đầu bằng C: \ hoặc tệp: Chúng sẽ xuất hiện khi bạn kiểm tra trang web trên máy tính của riêng mình, nhưng tất cả những người truy cập vào trang web của bạn sẽ thấy hình ảnh bị hỏng. Điều này là do C: \ trỏ đến một vị trí trên ổ cứng của bạn . Vì hình ảnh nằm trên ổ cứng của bạn, nó sẽ hiển thị khi bạn xem nó.