Bài viết này, mình sẽ trình làng với chúng ta cách chèn hình ảnh trong HTML. Trong HTML, hình hình ảnh được nhận thấy thông qua thẻ
Bạn đang xem: Chữ nằm trên hình css
Thẻ img là thẻ html bạn dùng tương đối thường xuyên trong quy trình làm web. Bởi thế, sau này các 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 cùng với những bạn mới bắt đầu)Công việc trước tiên bạn nên làm trước khi chèn ảnh, tất yếu đó là bạn cần tạo một tệp tin html để viết code.Bạn sẽ xem: Viết chữ đè lên hình ảnh trong html
1. Biện pháp chèn hình ảnh vào tệp tin htmlĐể hiển thị hình hình ảnh lên website thì bạn áp dụng thẻ img cùng với cú pháp sau:
Xem thêm: Phim Người Thương Kẻ Nhớ - Người Thương Kẻ Nhớ Tập 35 Hết
Rất đơn giản dễ dàng phải không các bạn
2. Các thuộc tính của thẻ IMG
Thẻ img có rất đầy đủ các ở trong tính chung 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 giỏi dùng
src - trực thuộc tính bắt buộcĐây là thuộc tính chứa đường truyền trỏ mang đến file hình (url). Có nhiều loại định hình hình 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 bên trên website dựa vào thẻ img. URL hoàn toàn có thể là URL kèm domain name hoặc là URL ngơi nghỉ trên máy của doanh nghiệp (dạng local).Ví dụ:
trungvietlaptop.com/canh.jpgimages/cooking.pngaltThuộc tính này có thể chấp nhận được 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. Tức thị nó đã hiển thị đoạn text gắng cho hình ảnh.Ví dụ:
. ở trong tính này sẽ không bắt buộc. Mặc dù nhiên, lúc làm bài bản thì nó cần phải có vì tốt cho SEO
width và height
Thuộc tính tùy chỉnh thiết lập chiều rộng (width) và độ cao (height) đến hình ảnh:Ví dụ:
2.2 các thuộc tính khác
ismapusemapSử dụng thẻ để tùy chỉnh thiết lập một phiên bản đồ ảnh. Một phiên bản đồ ảnh là một hình ảnh với các khu vực 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 ra một mối quan hệ giữa hình ảnh và bản đồ. Thẻ có chứa một số thẻ để thiết lập cấu hình vùng có thể click vào hình ảnh bản đồ.
3. Cung cấp các định mẫu mã ảnh
Chuẩn HTML không đưa ra một danh sách đị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 vài cách thực hiện 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à khi click vào hình ảnh sẽ ra 1 trang mớiĐể tạo link cho một hình ảnh, rất dễ dàng và đơn giản là bạn đặt thẻ img bên phía trong thẻ a
https://trungvietlaptop.com/cong-nghe/hoc-html.html" >Ví dụ 2: Căn hình ảnh nằm ở phía bên trái hoặc bên buộc phải của đoạn văn bản.Sử dụng ở trong tính css float nhằm đưa ảnh sang phía trái hoặc bên bắt buộc đoạn văn bản
Ảnh nằm cạnh phải, chữ nằm cạnh trái
Ảnh nằm cạnh sát trái, chữ nằm cạnh phải
Ví dụ 3:Thẻ img kết hợp với map nhằm tạo bạn dạng đồ hình ảnh
Xem bài xích này để biết cách sử dụng nằm trong tính maps trong thẻ Kết luận: Trong bài bác mình đã reviews cho các bạn cách thực hiện thẻ img để sinh sản hình hình ảnh đơn giản trong HTML. Bên cạnh đó các chúng ta có thể kết hợp thẻ img với một vài thẻ khác để triển khai những công dụng khá hữu dụng khác. Mình cũng có thể có một lời răn dạy nho nhỏ tuổi cho chúng ta là khi chèn ảnh trong html chúng ta luôn đảm bảo đủ 2 trực thuộc tính src và alt nhé, để theo chuẩn chỉnh w3c.