Thêm một chú thích Web để giữ hình ảnh của nó

Thêm chú thích HTML vào hình ảnh web trong 9 bước dễ dàng

Hình ảnh thêm cuộc sống vào các trang web của bạn và thu hút sự chú ý của người xem. Phụ đề cung cấp thêm thông tin về hình ảnh trên web của bạn, nhưng chúng có thể khó thêm vào các trang web không có kỹ năng HTML và CSS nâng cao. Dưới đây là một phương pháp đáng tin cậy để thêm chú thích đơn giản nhưng hấp dẫn vào hình ảnh ở lại với hình ảnh bất cứ nơi nào bạn di chuyển nó trên trang web.

9 bước cho một chú thích hình ảnh HTML

Thêm chú thích vào một hình ảnh và di chuyển chúng lại với nhau bất cứ nơi nào bạn muốn:

  1. Thêm hình ảnh vào trang web của bạn.
  2. Trong HTML cho trang web của bạn, hãy đặt thẻ div xung quanh hình ảnh:
  3. Thêm thuộc tính kiểu vào thẻ div:
    style = "" >
  4. Đặt chiều rộng của div thành cùng chiều rộng với hình ảnh, với thuộc tính chiều rộng :
    width: chiều rộng hình ảnh px; ">
  5. Đối với chú thích hơi nhỏ hơn văn bản xung quanh, hãy thêm thuộc tính kích thước phông chữ vào kiểu div:
    kích thước phông chữ: 80%; ">
  6. Phụ đề trông đẹp nhất nếu chúng được căn giữa bên dưới hình ảnh, vì vậy hãy thêm thuộc tính căn chỉnh văn bản vào thuộc tính style:
    text-align: center; "> < img src = "URL" alt = "văn bản thay thế" width = "width" height = "height" />
  7. Cuối cùng, thêm một khoảng trống nhỏ giữa hình ảnh và chú thích, bằng cách thêm thuộc tính style vào hình ảnh với thuộc tính style padding-bottom :
    style =" padding-bottom: 0.5em; " />
  1. Sau đó thêm chú thích văn bản ngay bên dưới hình ảnh:
    Đây là chú thích của tôi

Tải trang web lên máy chủ của bạn và kiểm tra nó trong trình duyệt.

Mẹo giới thiệu