Img - Thẻ Html để chèn ảnh (Src), căn chỉnh và ngắt dòng văn bản xung quanh ảnh (align), cũng như đặt nền (background)

Sự miêu tả

Để chèn hình ảnh đồ họa vào tài liệu HTML, hãy sử dụng thẻ HTML (hình ảnh viết tắt từ tiếng Anh từ hình ảnh- hình ảnh). Hình ảnh không được chèn trực tiếp vào trang web; thẻ chỉ chứa liên kết đến hình ảnh và tạo khoảng trống có kích thước cần thiết để hình ảnh được hiển thị ở định dạng đồ họa GIF, JPEG hoặc PNG:

  • JPG là định dạng phổ biến nhất cho ảnh. Hình ảnh có phần mở rộng .jpg hiển thị hàng triệu màu, điều này đặc biệt quan trọng để hiển thị chính xác các tông màu và độ chuyển màu khác nhau trong ảnh. Tuy nhiên, những hình ảnh như vậy không thể chứa các vùng trong suốt.
  • GIF được sử dụng cho đồ họa đơn giản như logo. Hình ảnh GIF không được sử dụng cho ảnh vì chúng không thể chứa nhiều thông tin màu sắc như hình ảnh JPG. Tuy nhiên, ảnh GIF có thể có các vùng trong suốt và có thể được nén thành các kích thước tệp rất nhỏ. Định dạng GIF cũng hỗ trợ hoạt ảnh.
  • PNG là định dạng hình ảnh, giống như JPG, cho phép bạn hiển thị hàng triệu màu và chứa các vùng trong suốt. Tuy nhiên, theo quy định, hình ảnh có phần mở rộng .png sẽ có kích thước lớn hơn một chút so với JPG hoặc GIF.

Thẻ HTML có hai thuộc tính bắt buộc: src và alt.

Thuộc tính src đóng vai trò quan trọng trong việc hiển thị đồ họa trên trang - nó đặt đường dẫn (tương đối hoặc tuyệt đối) đến hình ảnh, không được chèn về mặt kỹ thuật vào trang: trình duyệt hiển thị hình ảnh mà liên kết dẫn đến.

Thuộc tính alt chỉ định văn bản thay thế cho hình ảnh, văn bản này sẽ chỉ được hiển thị khi hình ảnh không thể hiển thị được (đường dẫn chỉ định không chính xác hoặc hình ảnh đã bị xóa).

Nếu cần, hình ảnh có thể được tạo liên kết, để làm điều này, bạn chỉ cần đặt thẻ bên trong phần tử. Trong trường hợp này, một khung sẽ xuất hiện xung quanh hình ảnh, có thể dễ dàng xóa khung này bằng cách sử dụng CSS:

Hình ảnh cũng có thể được sử dụng làm bản đồ hình ảnh - đây là nơi một hình ảnh chứa một số vùng hoạt động có hình dạng khác nhau, mỗi vùng là một liên kết riêng biệt. Một tấm thẻ như vậy trông không khác gì một hình ảnh thông thường.

Lưu ý: Để thêm hình ảnh vào trang web, bạn cũng có thể sử dụng thuộc tính CSS hình nền, cho phép bạn thay thế nền bình thường của thành phần bằng hình ảnh.

Thuộc tính

src: Cho trình duyệt biết vị trí (URL) của hình ảnh mong muốn. Ví dụ » alt: Cung cấp mô tả văn bản của ảnh, chỉ được hiển thị nếu ảnh không thể hiển thị vì lý do nào đó.

Lưu ý: để tạo chú giải công cụ khi bạn di chuột qua hình ảnh, bạn cần sử dụng thuộc tính tiêu đề chung. Giá trị thuộc tính là một chuỗi tùy ý trong đó bạn có thể cung cấp thêm thông tin về hình ảnh.

Ví dụ » Nếu một hình ảnh được sử dụng làm vật trang trí cho trang web và không mang bất kỳ ý nghĩa ngữ nghĩa nào thì thay vì mô tả hình ảnh, bạn có thể để lại một dòng trống (alt="") làm giá trị. chiều cao: Chỉ định chiều cao của hình ảnh tính bằng pixel. ismap: Thuộc tính ismap là thuộc tính Boolean. Sự hiện diện của nó cho trình duyệt biết rằng hình ảnh là một phần của bản đồ hình ảnh nằm trên máy chủ (bản đồ hình ảnh là hình ảnh có các khu vực tương tác). Các giá trị hợp lệ cho thuộc tính boolean ismap: Khi bạn nhấp vào vùng tương tác của bản đồ hình ảnh, tọa độ nhấp chuột sẽ được gửi đến máy chủ trong chuỗi truy vấn URL.

Lưu ý: thuộc tính ismap chỉ được sử dụng nếu phần tử là phần tử con của thẻ , chứa thuộc tính href.

Usemap: Xác định hình ảnh dưới dạng bản đồ hình ảnh. Giá trị (phải bắt đầu bằng ký tự "#") được chỉ định trong thuộc tính này được liên kết với giá trị của thuộc tính name hoặc id của thẻ và tạo kết nối giữa các phần tử . Ví dụ "

Lưu ý: thuộc tính usemap không thể được sử dụng nếu phần tử là hậu duệ của phần tử hoặc