Регистрация Войти
Войти через VK




Поиск по сайту



PHP Поиск



Картинки на сайте. Тег <img>

Для вставки в текст картинки используется одиночный тег <img> с обязательным атрибутом src, указывающим адрес графического файла. Адрес изображения задается так же, как и адрес ссылки. Например:

<img src="image.gif" alt="Картинка в формате gif">
<img src="jpeg/image.jpg" alt="Картинка в формате jpeg">
<img src="/image/image.png" alt="Картинка в формате png">

Форматы изображений

GIF

Формат Graphical Interchange Format. Точное название – GIF89A. Был разработан для сети CompuServe. После ряда усовершенствований приобрел много важных свойств, включающих:

  • сжатие данных без потерь;
  • поддержка прозрачного фона, т. е. возможность создания изображений с прозрачными участками (любой пиксель может быть либо полностью прозрачным, либо абсолютно непрозрачным);
  • чересстрочный вывод на экран, что дает возможность рассмотреть изображение до конца загрузки.

Примечание:
Этот формат, как и некоторые другие, использует алгоритм сжатия LZW, запатентованный компанией Unisys. В конце 1994 года эта компания объявила, что любому разработчику программных продуктов, использующих формат GIF, впредь будет требоваться лицензия от Unisys. Это требование касалось только разработчиков и не затрагивало конечных пользователей. В специальном заявлении компания также уточнила, что использование GIF в WWW допустимо и не нуждается в лицензировании.

JPEG Был создан группой экспертов в области фотографии (Joint Photographic Experts Group) в результате разработки стандартного метода сжатия фотографических изображений "с потерями". Основные свойства формата:

  • сжатие "с потерями", поэтому изображение теряет некоторые (несущественные) детали;
  • размер файла сжатого изображения, как правило, меньше, чем в случае GIF, т.е. файл передается быстрее;
  • поддержка 16,7 миллионов цветов, что обеспечивает очень хорошее качество цветопередачи;
  • потеря деталей вокруг четких контуров (дрожание линий), что делает формат непригодным для передачи изображений с высокой четкостью и графического текста.
PNG

Формат Portable Network Graphics был разработан в 1995 году, чтобы прийти на смену формату GIF после действий Unisys по защите авторских прав на алгоритм сжатия LZW. Одновременно были переработаны некоторые технические характеристики, в частности, улучшено сжатие и увеличено количество поддерживаемых цветов. Только в формате PNG можно сохранить полупрозрачные области картинок (например, тени). Основные достоинства формата:

  • сжатие без потерь;
  • поддержка 254 уровней частичной прозрачности, что позволяет сохранить полупрозрачные области картинок (например, тени);
  • двумерная чересстрочная развёртка.
Атрибуты тега <img>
src Адрес графического файла.
alt Альтернативный текст. Позволяет получить текстовую информацию об изображении при отключенной в браузере загрузке изображений. Является обязательным атрибутом для SEO-продвижения сайта.
title Всплывающий текст, появляющийся при наведении курсора мышки на изображение.
width Реальная ширина изображения в пикселях.
height Реальная высота изображения в пикселях.

Атрибуты width и height при совместном использовании позволяют браузеру зарезервировать место на экране для изображения еще до того, как оно будет передано по сети. Это позволяет пользователю начать чтение, пока передача данных еще продолжается. Атрибуты width и height должны задавать реальный размер изображения. Например:

<img src="venera.jpg" width="110" height="168" alt="Венера Милосская"
title="Венера Милосская">

Если Вы хотите, чтобы изображение появилось справа или слева от текста, воспользуйтесь свойством float.

Читать дальше: Таблицы


.

Популярное:


Содержание:


Новое за неделю



Сейчас на сайте: 859
Rambler's Top100