HTML тег img
❮ Назад Полный справочник HTML Далее ❯
Пример
Как вставить изображение:
Попробуй сам »
Больше примеров «Попробуй сам» ниже .
Определение и использование
Тег
используется для встраивания изображения в HTML-страницу.
Технически изображения не вставляются на веб-страницу; изображений
связаны с веб-страницами. Тег
создает пространство для хранения изображения, на которое указывает ссылка.
Тег
имеет два обязательных атрибута:
- src — указывает путь к изображению
- alt — Указывает альтернативный текст для изображения, если изображение для некоторых причина не может быть отображена
Примечание: Также всегда указывайте ширину и высоту изображения. Если ширина и высота не указаны, страница может мерцать при отображении изображения. нагрузки.
Совет: Чтобы связать изображение с другим документом, просто вставьте тег
внутрь
тег (см. пример ниже).
Поддержка браузера
Элемент | |||||
---|---|---|---|---|---|
Да | Да | Да | Да | Да |
Атрибуты
Атрибут | Значение | Описание |
---|---|---|
или | текст | Указывает альтернативный текст для изображения |
перекрестное происхождение | анонимный использование учетных данных | Разрешить использование изображений со сторонних сайтов, которые разрешают доступ к другим источникам, с холстом |
высота | пикселей | Определяет высоту изображения |
исмап | ismap | Указывает изображение в качестве карты изображений на стороне сервера |
загрузка | нетерпеливый ленивый | Указывает, должен ли браузер загружать изображение немедленно или отложить загрузка изображений до выполнения некоторых условий |
длинное описание | URL-адрес | Указывает URL-адрес подробного описания изображения |
реферальная политика | без реферера без реферера при переходе на более раннюю версию источник источник-при-перекрестном происхождении небезопасный URL-адрес | Указывает, какую информацию о реферере использовать при получении изображения |
размеры | размеры | Задает размеры изображений для разных макетов страниц |
источник | URL-адрес | Указывает путь к образу |
Список URL-адресов | Задает список файлов изображений для использования в различных ситуациях | |
карта использования | #имя_карты | Указывает изображение в качестве карты изображения на стороне клиента |
ширина | пикселей | Задает ширину изображения |
Глобальные атрибуты
Тег
также поддерживает глобальные атрибуты в HTML.
Атрибуты событий
Тег
также поддерживает атрибуты событий в HTML.
Другие примеры
Пример
Выровнять изображение (с помощью CSS):
Попробуйте сами »
Пример
Добавить границу изображения (с помощью CSS):
Попробуйте сами »
Пример
Добавьте левое и правое поля к изображению (с помощью CSS):
Попробуйте сами »
Пример
Добавить верхнее и нижнее поля к изображению (с помощью CSS):
gif» alt=»Smiley face»>
Попробуйте сами »
Пример
Как вставить изображения из другой папки или с другого веб-сайта:
Попробуйте сами »
Пример
Как добавить гиперссылку на изображение:
Попробуйте сами »
Пример
Как создать карту изображения с кликабельными областями. Каждый регион гиперссылка:
Попробуйте самостоятельно »
Связанные страницы
Учебник HTML: HTML Images
HTML DOM Ссылка: изображение объект
Учебник CSS: Стилирование изображения
. элемент
со следующими значениями по умолчанию:Пример
img {
display: inline-block;
}
Попробуйте сами »
❮ Предыдущая Полный справочник HTML Далее ❯
ВЫБОР ЦВЕТА
Лучшие учебники
HTML TutorialCSS Tutorial
JavaScript Tutorial
How To Tutorial
SQL Tutorial
Python Tutorial
W3.CSS Tutorial
Bootstrap Tutorial
PHP Tutorial
Java Tutorial
C++ Tutorial
jQuery Tutorial
Top References
Справочник по HTMLСправочник по CSS
Справочник по JavaScript
Справочник по SQL
Справочник по Python
Справочник по W3. CSS
Справочник по Bootstrap
Справочник по PHP
Цвета HTML
Справочник по Java
Справочник по Angular
Справочник по jQuery
Лучшие примеры
Примеры HTMLПримеры CSS
Примеры JavaScript
Примеры инструкций
Примеры SQL
Примеры Python
Примеры W3.CSS
Примеры Bootstrap
Примеры PHP
Примеры Java
Примеры XML
Примеры jQuery
FORUM | О
W3Schools оптимизирован для обучения и обучения. Примеры могут быть упрощены для улучшения чтения и обучения. Учебники, ссылки и примеры постоянно пересматриваются, чтобы избежать ошибок, но мы не можем гарантировать полную правильность всего содержания. Используя W3Schools, вы соглашаетесь прочитать и принять наши условия использования, куки-файлы и политика конфиденциальности.
Copyright 1999-2023 Refsnes Data. Все права защищены.
W3Schools работает на основе W3.CSS.
Преобразование типов файлов изображений с помощью Preview на Mac
Искать в этом руководстве
- Добро пожаловать
- Открывайте PDF-файлы и изображения
- Просмотр PDF-файлов и изображений
- Поиск текста в PDF-файлах
- Взаимодействие с текстом на фотографии
- Добавляйте PDF-страницы в закладки
- Просмотр информации о файлах PDF и изображениях
- Импорт изображений с камеры
- Посмотрите, где было сделано фото
- Отображение PDF в виде слайд-шоу
- Просмотр анимированных GIF-кадров
- Заполнять и подписывать PDF-формы
- Выделить и скопировать текст в PDF
- Выделение, подчеркивание и зачеркивание текста
- Добавление заметок и речевых пузырей в PDF
- Аннотировать PDF
- Объединить PDF-файлы
- Обрезать или повернуть PDF
- Добавление эффектов в PDF
- Изменение размера, поворот или отражение изображения
- Преобразование типов файлов изображений
- Извлечь изображение или удалить фон
- Аннотировать изображение
- Посмотрите, как изображение выглядит на другом устройстве
- Применение цветового профиля к изображению
- Сохраняйте PDF-файлы и изображения
- Отменить изменения в PDF-файлах и изображениях
- Копировать PDF-файлы и изображения
- Блокировка PDF-файлов и изображений
- Экспорт PDF-файлов и изображений
- Защитите PDF паролем
- Сжать PDF-файл
- Печать PDF-файлов и изображений
- Если вы не можете выделить или скопировать текст в PDF
- Если изображения или PDF-файлы имеют неправильный размер
- Если при переходе на страницу отображается неправильная страница PDF-файла
- Изменить настройки предварительного просмотра
- Горячие клавиши
- Авторские права
Preview может преобразовывать файлы изображений во многие типы файлов, включая JPEG, JPEG 2000, PDF, PNG, PSD, TIFF и другие.