Bài viết này, bản thân sẽ trình làng với chúng ta cách chèn hình ảnh trong HTML. Vào HTML, hình hình ảnh được nhận thấy thông qua thẻ
Bạn đang xem: Chèn chữ vào ảnh html
Thẻ img là thẻ html bạn dùng tương đối thường xuyên trong quá trình làm web. Bởi 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 nhằm thực hành với thẻ img(đối cùng với những các bạn mới bắt đầu)Công việc trước tiên bạn đề nghị làm trước lúc chèn ảnh, tất yếu đó là bạn phải tạo một file html nhằm viết code.Bạn sẽ xem: Viết chữ đè lên ảnh trong html
1. Biện pháp chèn hình ảnh vào tệp tin htmlĐể hiển thị hình ảnh lên web thì bạn áp dụng thẻ img với cú pháp sau:
Xem thêm: Đồ Chơi Treo Nôi Cho Bé Nhìn Tốt Nhất, 8 Loại Đồ Chơi Treo Nôi Chỉ Lợi Không Hại Cho Bé
Rất đơn giản và dễ dàng phải không chúng ta
2. Các thuộc tính của thẻ IMG
Thẻ img có rất đầy đủ các thuộc tính thông thường của thẻ HTML.Ngoài ra, thẻ img còn tồn tại thêm các thuộc tính
2.1 những thuộc tính tốt dùng
src - trực thuộc tính bắt buộcĐây là thuộc tính chứa băng thông trỏ mang đến file hình (url). Có tương đối nhiều loại định dạng hình ảnh khác nhau như: gif, png, jpg,…. Và toàn bộ đều hoàn toàn có thể hiện thị được trên website nhờ thẻ img. URL hoàn toàn có thể là URL kèm domain hoặc là URL làm việc trên máy của công ty (dạng local).Ví dụ:
thailantour.com/canh.jpgimages/cooking.pngaltThuộc tính này chất nhận được bạn hiển thị một đoạn text sửa chữa thay thế cho hình ảnh khi url bị sai hoặc tất cả lỗi kết nối. Tức là nó vẫn hiển thị đoạn text vắt cho hình ảnh.Ví dụ:
. ở trong tính này sẽ không bắt buộc. Tuy nhiên, lúc làm bài bản thì nó cần có vì tốt cho SEO
width và height
Thuộc tính tùy chỉnh chiều rộng lớn (width) và chiều cao (height) mang đến hình ảnh:Ví dụ:
2.2 các thuộc tính khác
ismapusemapSử dụng thẻ để thiết lập cấu hình một bản đồ ảnh. Một bạn dạng đồ ảnh là một hình hình ảnh với các khu vực hoàn toàn có thể click.Thuộc tính name của thẻ được kết phù hợp với thuộc tính usermap để tạo nên một mối quan hệ giữa hình ảnh và bạn dạng đồ. Thẻ có chứa một vài thẻ để tùy chỉnh vùng rất có thể click vào hình hình ảnh bản đồ.
3. Cung cấp các định ngoại hình ảnh
Chuẩn HTML không đưa ra một list định dạng được hỗ trợ. Tuy nhiên, mình xin được reviews với các bạn một số định dạng hay được dùng với thẻ JPEG, GIF, PNG, APNG, SVG, BMP, BMP ICO, PNG, ICO
4. Một số trong những cách áp dụng thẻ img
Ví dụ 1:Kết hợp với thẻ a nhằm tạo link cho hình ảnh. Nghĩa là lúc click vào hình ảnh sẽ ra 1 trang mớiĐể tạo links cho một hình ảnh, rất đơn giản là các bạn đặt thẻ img bên trong thẻ a
https://thailantour.com/cong-nghe/hoc-html.html" >Ví dụ 2: Căn ảnh nằm ở phía trái hoặc bên đề xuất của đoạn văn bản.Sử dụng nằm trong tính css float để đưa ảnh sang phía trái hoặc bên phải đoạn văn bản
Ảnh nằm sát phải, chữ nằm sát trái
Ảnh nằm sát trái, chữ nằm cạnh phải
Ví dụ 3:Thẻ img kết phù hợp với map để tạo bản đồ hình ảnh
Xem bài bác này để biết cách sử dụng trực thuộc tính bản đồ trong thẻ Kết luận: Trong bài mình đã ra mắt cho các bạn cách áp dụng thẻ img để tạo thành hình ảnh đơn giản vào HTML. Hình như các chúng ta có thể kết thích hợp thẻ img với một số trong những thẻ khác để gia công những tác dụng khá bổ ích khác. Mình cũng đều có một lời khuyên nho nhỏ tuổi cho các bạn là lúc chèn hình ảnh trong html các bạn luôn đảm bảo đủ 2 ở trong tính src và alt nhé, nhằm theo chuẩn chỉnh w3c.