ProgrammerBook.ru: Обратите внимание, что

  1. данный документ является переводом документа «Figures»;
  2. данный документ может содержать неточности, опечатки и ошибки перевода;
  3. официальным документом по данной тематике является оригинальный документ на английском языке, расположенный на сайте W3C.

Рисунки

Допустимый Контекст: %body.content, %flow, %block
Модель Содержимого: Необязательные НАЛОЖЕНИЯ, после которых следует необязательная ПОДПИСЬ, после которой идёт %body.content и может заканчиваться необязательным ЗАИМСТВОВАНИЕМ

Элемент FIG используется для вставки рисунков. Последующие элементы будут обтекать рисунок, если присутствует достаточно места. Такое поведение перестаёт действовать в случаях, когда атрибут align имеет значение center (по умолчанию) или justify.

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

Текстовое описание рисунка призвано передать содержание рисунка для людей с неграфическими агентами пользователей, в то время как подпись рисунка и заимствование представляется как для графических, так и для неграфических агентов пользователей. Элемент FIG улучшает элемент IMG, позволяя авторам использовать разметку в тексте описания. Модель содержимого позволяет авторам включать заголовки, которые соответствуют модели содержимого в случае, когда заголовки являются частью данных изображения. Модель содержимого также позволяет использование графических гипертекстовых ссылок, которые могут быть указаны в разметке и будут интерпретироваться агентом пользователя, а не сервером.

Якорные элементы в текстовом описании рисунка играют двойную роль: неграфические агенты пользователей показывают обычные гипертекстовые ссылки, в то время как для графических агентов пользователей, те же самые якорные элементы задают графические гипертекстовые ссылки с помощью атрибута SHAPE, обозначающего горячие зоны. Это сделано для того, чтобы упростить задачу авторов, пишущих для обеих аудиторий. Будем надеяться, что элемент FIG поможет бороться с тенденцией среди авторов, которые забывают о людях с ограниченным доступом к терминалу или о слабовидящих, использующих преобразование текста в речь, так как новый элемент заставляет вас писать текст описания для определения графических гипертекстовых ссылок.

Для некоторых приложений горячие зоны динамически определяются программами, запущенными на сервере. HTML 3.0 допускает передачу кликов и перетаскиваний на сервер, с помощью атрибута IMAGEMAP. Горячие зоны также могут быть определены как часть формата графических данных, например, как в VRML. Горячие зоны в элементе FIG имеют приоритет над горячими зонами в графических данных, которые, в свою очередь, имеют приоритет над прохождением события в программе серверной карты изображения.

Горячие зоны в накладываемых графических данных имеют приоритет над горячими зонами в данных рисунка. Точно так же атрибут imagemap в наложениях имеет приоритет над атрибутом imagemap в рисунке. Для группы наложений приоритет определяется порядком появления OVERLAY элементов внутри элемента FIG. Поздние наложения имеют приоритет над более ранними.

Примеры

Фотографические изображения с подписью и заимствованиями:

<FIG SRC="nicodamus.jpeg">
  <CAPTION>Первый обитатель: <I>Nicodamus bicolor</I>
  строит шёлковые силки</CAPTION>
  <P>Небольшой волосатый паук светло-красного цвета с коричневым брюшком.
  <CREDIT>J. A. L. Cooke/OSF</CREDIT>
</FIG>

Домашняя страница компании:

<FIG SRC="mainmenu.gif">
 <H1>Доступ к HP от Hewlett Packard</H1>
 <P>Выберите между:
 <UL>
  <LI><A HREF="guide.html" SHAPE="rect 30,200,60,16">Руководство по Access</A>
  <LI><A HREF="about.html" SHAPE="rect 100,200,50,16">О HP</A>
  <LI><A HREF="guide.html" SHAPE="rect 160,200,30,16">Новости</A>
  <LI><A HREF="guide.html" SHAPE="rect 200,200,50,16">Продукция</A>
  <LI><A HREF="guide.html" SHAPE="rect 260,200,80,16">Контакты по всему миру</A>
 </UL>
</FIG>

Аэроснимок с наложением карты:

<FIG SRC="newyork.jpeg">
  <OVERLAY SRC="map.gif">
  <P>Вид Нью-Йорка с воздуха!
</FIG>

Допустимые Атрибуты

ID
SGML-идентификатор используется в качестве цели для гипертекстовых ссылок или для именования отдельных элементов в присоединённых таблицах стилей. Идентификаторы NAME лексем должны быть уникальными в рамках текущего документа.
LANG
Это одна из кратких меток ISO стандарта языка, например «en.uk» для варианта английского языка используемого в Соединённом Королевстве. Он может быть использован обработчиками при выборе конкретного языкового варианта кавычек, лигатур, правил переноса и так далее. Атрибут языка состоит из двухбуквенного кода языка, соответствующего стандарту ISO 639, в случае необходимости, за которым следует точка и двухбуквенный код страны, соответствующий стандарту ISO 3166.
CLASS
Это разделённый пробелами список SGML NAME лексем, которые используются для именования подклассов тега. По соглашению, имена классов интерпретируются иерархически, с самого общего класса слева до наиболее специфичного справа, где классы разделены точкой. Атрибут CLASS чаще всего используется для прикрепления другого стиля к некоторому элементу, но это является рекомендацией, чтобы практические имена классов были выбраны на основе семантики элемента, так как это позволит использование для других целей, таких как ограничение поиска по документам путём сопоставления имён классов элемента. Соглашения по выбору имён классов выходят за рамки данной спецификации.
CLEAR
Когда уже есть рисунок или таблица на полях, иногда вы хотите расположить другой рисунок под рисунком на полях, а не рядом с ним. Атрибут CLEAR позволяет перемещаться вниз без всяких условий:

clear=left
запрещает обтекание слева
clear=right
запрещает обтекание справа
clear=all
запрещает обтекание как слева, так и справа

В качестве альтернативы, вы можете решить разместить рисунок рядом с рисунком при наличии достаточного места. Минимально-необходимая ширина определяется следующим образом:

clear="40 en"
запрещает обтекание до тех пор пока смежное горизонтальное пространство не станет более 40 en
clear="100 pixels"
запрещает обтекание до тех пор пока смежное горизонтальное пространство не станет более 100 пикселей

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

NOFLOW
Присутствие этого атрибута запрещает расположение потока текста вокруг рисунка. Данный атрибут избавляет от необходимости использования CLEAR или NEEDS атрибутов в следующем элементе.
SRC
Определяет графическое содержимое рисунка. Изображение указывается в виде URI-адреса. Этот атрибут может появляться вместе с атрибутом MD.
MD
Определяет сообщение дайджеста или криптографическую контрольную сумму для соответствующей графики, определённой в атрибуте SRC. Он используется, когда вы хотите быть уверены в том, что прикреплённый объект действительно является тем самым, который был задуман автором, и не был изменён каким-либо образом. Например, MD="md5:jV2OfH+nnXHU8bnkPAad/mSQlTDZ", определяет контрольную сумму MD5, закодированную в виде base64 строки символов. Атрибут MD, как правило, допускается для всех элементов, которые поддерживают ссылки с использованием URI.
ALIGN
Определяет горизонтальное выравнивание рисунка:

BLEEDLEFT
Выравнивает левый край по левой границе (окна).
LEFT
Выравнивает левый край по левому краю текстового поля.
CENTER
Рисунок выравнивается по центру между текстовыми полями и при этом окружающий текст не обтекает рисунок. Это ALIGN значение по умолчанию.
RIGHT
Выравнивает правый край по правому краю текстового поля.
BLEEDRIGHT
Выравнивает правый край по правой границе (окна).
JUSTIFY
При применении данного значения пробелы следует увеличивать или уменьшать для того, чтобы заполнить пространство между левым и правым полем текста. Для align=justify обтекание текста вокруг фигуры отключено.
WIDTH
Определяет необходимую ширину в пикселях или в en единицах (в зависимости от значения атрибута UNITS). Агенты пользователей могут масштабировать изображение рисунка, чтобы соответствовать этой ширине.
HEIGHT
Определяет необходимую высоту в пикселях или в en единицах (в зависимости от значения атрибута UNITS). Агенты пользователей могут масштабировать изображение рисунка, чтобы соответствовать этой высоте.
UNITS
Определяет выбор единиц для ширины и высоты. units=pixels (используется по умолчанию) определяет пиксели, в то время как units=en определяет en единицы. en единица -- это типографическая единица, равная половине размера точки.
IMAGEMAP
Определяет URI-адрес для обработки событий, связанных с кликами и перетаскиванием изображения.