Skip to main content

Как правильно использовать HTML-тег изображения?

Изображения часто добавляются на веб-страницы, чтобы они выглядели более привлекательно и интересно по сравнению со страницей простого текста. С помощью тега HTML-изображения легко добавлять изображения на любые веб-страницы. Этот тег также имеет ряд атрибутов или характеристик, которые вы можете указать.

При добавлении изображений на веб-страницу важно помнить, что изображение на самом деле не является частью файла, который составляет саму веб-страницу. Файлы, используемые для веб-страницы, являются отдельными файлами от всех файлов изображений. HTML-тег Image ссылается веб-браузером на определенный файл изображения для изображения, которое вы хотите показать. Когда веб-страница отображается в браузере, файл изображения отображается вместе с любыми другими файлами, составляющими эту страницу.

Код для тега HTML-изображения: <IMG SRC = "расположение изображения" />. Расположение изображения - это имя файла для изображения, которое вы хотите показать, и место, где изображение хранится. Важно, чтобы вы правильно указали эту информацию, чтобы обеспечить правильное отображение изображения. Организация и хранение изображений, которые вы хотите использовать на своей веб-странице, являются важными соображениями.

Некоторые люди хранят свои изображения в том же каталоге, что и все остальные части своих веб-страниц. В этом случае, когда вы ссылаетесь на изображение, вы должны включить только имя файла в тег HTML Image. Когда на веб-странице есть несколько изображений, обычно создается подкаталог, который часто называют изображениями . В этом случае имя подкаталога также будет включено в тег.

В качестве примера, вот что мы сделаем, чтобы вставить изображение дерева с именем tree.jpg на веб-страницу. Если бы мы сохранили изображение дерева в том же месте, что и другие наши файлы веб-страниц, тег HTML-изображения был бы <IMG SRC = "tree.jpg">. Если файл изображения был сохранен в подкаталоге в каталоге нашей веб-страницы, тег будет изменен на <IMG SRC = "images / tree.jpg">. Важно помнить, что тег HTML-изображения предоставляет ссылку или путь к файлу изображения. По сути, он сообщает браузеру, где искать файл.

Тег HTML-изображения имеет ряд атрибутов, которые можно указать для изображения, которое вы хотите включить. Атрибуты являются характеристиками самого тега, поэтому они используются внутри тега или между <и>. Атрибуты, которые используются с тегом HTML-изображения:

  • ALIGN - указывает, как ваше изображение выровнено относительно текста на вашей странице (ВЛЕВО, ВПРАВО, ВЕРХ, СРЕДНИЙ, ВНИЗ)
  • ALT - относится к альтернативному тексту. Это очень важный атрибут и должен быть включен для всех ваших изображений. Он указывает текст, который отображается вместо изображения
  • BORDER - добавляет рамку к вашему изображению с толщиной, указанной в пикселях
  • ВЫСОТА и ШИРИНА - могут быть использованы для определения ширины и высоты изображения, которое вы хотите отобразить, что позволяет изменить размер изображения. Будьте внимательны при использовании этих атрибутов, так как вы можете изменить качество изображения и пропорции, что приведет к ухудшению качества изображения.
  • VSPACE и HSPACE - используются для добавления пустого пространства вокруг вашего изображения.