Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
Завдання
Вставити зображення на веб-сторінку.
Рішення
Для додавання зображення в документ застосовується тег <img>, його атрибут src визначає шлях до графічного файлу, який повинен бути у форматі GIF, PNG або JPEG. Також для тега <img> необхідно вказати обов'язковий атрибут alt, він описує альтернативний текст видимий в процесі завантаження зображення або при відключенні зображень в браузері.
В HTML4, HTML5 <img src="шлях до файлу" alt="альтернативний текст">
В XHTML <img src="шлях до файлу" alt="альтернативний текст" />
Якщо графічний файл знаходиться в одній папці з HTML-документом, то в якості шляху достатньо вказати лише ім'я файлу (приклад 1).
Приклад 1. Додавання картинки на веб-сторінку
HTML5IECrOpSaFx
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Мої малюнки</title> </head> <body> <p><img src="images/dzen.png" alt="Листи майстра дзен"></p> </body> </html>
Врахуйте, що коли використовується XHTML або строгий HTML4, тег <img> допустимо розміщувати тільки всередині блочних елементів на зразок <p> або <div>.