Học HTML Cách chèn hình ảnh trong html [bài 4]
Bài viết này, mình sẽ giới thiệu với các bạn cách chèn hình ảnh trong HTML. Trong HTML, hình ảnh được nhận biết thông qua thẻ . Thẻ là thẻ rỗng, nó không có thẻ đóng. Để tìm hiểu chi tiết, các bạn theo dõi bài viết sau:
Thẻ img là thẻ html bạn dùng tương đối thường xuyên trong quá trình làm web. Vì thế, sau này bạn sẽ vận dụng thẻ img nhiều đó. Bạn dành ra khoảng 30 phút để thực hành với thẻ img(đối với những bạn mới bắt đầu)
Công việc đầu tiên bạn cần làm trước khi chèn ảnh, tất nhiên đó là bạn cần tạo một file html để viết code.
Công việc đầu tiên bạn cần làm trước khi chèn ảnh, tất nhiên đó là bạn cần tạo một file html để viết code.
1. Cách chèn hình ảnh vào file html
Để hiển thị hình ảnh lên web thì bạn sử dụng thẻ img với cú pháp sau:
Ví dụ:
Rất đơn giản phải không các bạn
2. Các thuộc tính của thẻ IMG
Thẻ img có đầy đủ các thuộc tính chung của thẻ HTML.
Ngoài ra, thẻ img còn có thêm các thuộc tính
2.1 Các thuộc tính hay dùng
- src - thuộc tính bắt buộc
Đây là thuộc tính chứa đường dẫn trỏ đến file hình (url). Có nhiều loại định dạng hình ảnh khác nhau như: gif, png, jpg,…. Và tất cả đều có thể hiện thị được trên website nhờ thẻ img. URL có thể là URL kèm domain hoặc là URL ở trên máy của bạn (dạng local).
Ví dụ:
tech12h.com/canh.jpg
images/cooking.png
- alt
Thuộc tính này cho phép bạn hiển thị một đoạn text thay thế cho hình ảnh khi url bị sai hoặc có lỗi kết nối. Nghĩa là nó sẽ hiển thị đoạn text thay cho hình ảnh.
Ví dụ:
. Thuộc tính này không bắt buộc. Tuy nhiên, khi làm chuyên nghiệp thì nó cần có vì tốt cho SEO
- width và height
Thuộc tính thiết lập chiều rộng (width) và chiều cao (height) cho hình ảnh:
Ví dụ:
2.2 Các thuộc tính khác
- ismap
Sử dụng thuộc tính này thì khi click lên image, tọa độ vị trí click chuột sẽ được gửi về server. Thuộc tính này chỉ được cho phép khi thẻ được đặt trong thẻ a với một href hợp lệ.
- usemap
Sử dụng thẻ
Từ khóa tìm kiếm: Chèn ảnh trong HTMl, sử dụng thẻ IMG, cách dùng img tag
Xem thêm những bài khác
- Hướng dẫn chi tiết các bước làm một website
- Lựa chọn công nghệ, phần mềm cần cài đặt để làm website
- Hướng dẫn cài đặt Xampp chi tiết bằng hình ảnh
- Hướng dẫn cài đặt Drupal chi tiết trên localhost
- Giới thiệu thành phần, cấu trúc của 1 trang web
- Hướng dẫn cài đặt theme, module trong site Drupal
- Khái niệm cần biết khi xây dựng web drupal
- Một số module thường dùng trong drupal
- Hướng dẫn tạo chuyên mục trong drupal
- Xóa dấu tiếng việt trong đường dẫn web drupal
- Tên miền là gì?
- Làm thế nào để đăng ký tên miền: đơn giản, nhanh chóng ?
- Tên miền giá rẻ: những thông tin cần biết
- Website là gì?
- Kiến thức cần biết để làm 1 website
- Hướng dẫn sử dụng Hook trong drupal cho người mới bắt đầu
- Hướng dẫn sử dụng hook_form_alter trong drupal
- Hướng dẫn chi tiết cách tạo module trong drupal
- Kinh nghiệm lựa chọn đối tác thiết kế web cho doanh nghiệp
- Thế nào là một thiết kế website tốt?
- Những vấn đề cần biết trước khi dự định thiết kế web
- Những câu hỏi cần đặt ra với đối tác thiết kế web cho bạn
- Chi phí thiết kế web, giá làm web hết bao nhiêu?
Bình luận