Как правило, иллюстрации (изображения) должны иметь подписи. Подпись, или подрисуночная подпись, — текст под иллюстрацией, который определяет ее тематическое содержание, поясняет изображение или сообщает об источнике. Словесная надпись делает изображение понятным. Наглядность его возрастает.
В наиболее полном виде в состав подписи входят:
Состав подписи может быть сокращен или дополнен: характер сокращений и дополнений зависит от вида и особенностей иллюстраций.
Иллюстрации нумеруют прежде всего для того, чтобы на них удобно было кратко ссылаться в тексте. Если на иллюстрацию не требуется ссылаться в основном тексте, как, например, на портрет автора перед его произведением, или на портрет лица, которому посвящено издание, или на любые иллюстрации в
Единственную иллюстрацию не нужно нумеровать по той простой причине, что при ссылке на нее в осн. тексте достаточно назвать только вид изображения (схема, чертеж, рисунок, фотография) или употребить слово иллюстрация, чтобы читатель нашел эту иллюстрацию.
Перед порядковым номером изображения знак номера (№) не ставится.
После порядкового номера иллюстрации, если он вместе с условным названием иллюстрации или без этого названия выключен отдельной строкой, знак препинания (точку) не ставят.
Например, Рис. 1
Если основная подпись следует непосредственно за порядковым номером, продолжая начатую им строку, то порядковый номер завершается точкой.
Например, Рис. 2. Описание изображения
В конце подписи точки не ставят, за исключением случаев, когда подпись представляет собой цитату из иллюстрируемого художественного произведения (законченную
После основной подписи, если далее следует экспликация, принято ставить двоеточие.
Подпись всегда начинают с прописной буквы, независимо от того, какой элемент идет первым, экспликацию — со строчной буквы.
Подписи к иллюстрациям рекомендуется набирать шрифтом меньшего кегля по сравнению со шрифтом основного текста.
Условное обозначение и номер выделяются шрифтом.
Купить «Справочник издателя и автора:
Если ширина изображения равна ширине блока основного текста, добавить подпись можно с помощью обычного абзаца (<p></p>). Однако, этот способ не работает, как только изображение имеет небольшой размер и его необходимо расположить по краю
Чтобы связать изображение и подпись к нему, их следует поместить в один блок, присвоить ему имя и применить к нему различные стилевые параметры.
Подходит при условиях: а) одно изображение; б) несколько изображений одной ширины; в) длина подрисуночной подписи меньше ширины изображения.
#images_description
{
display: block;
float: left;
margin: 0 1em 2em 0;
padding: 0;
position: relative;
}
#images_description img
{
border: medium none;
display: block;
margin: 0 0 1em;
padding: 0;
}
.description
{
font-size:15px; /* размер шрифта меньше основного */
line-height: 1.3;
margin: 0;
padding: 0;
position: inherit;
text-align: left;
}
Размещение изображения и подрисуночной подписи на странице.
<div id="images_description">
<img src="путь к изображению" width="" height=""
alt="описание изображения" />
<span class="description">Подрисуночная подпись</span>
</div>
Если ширина блока с изображением не задается, то она будет определяться автоматически, исходя из размера изображения. Если подрисуночная подпись будет длинной — блок растянется. Исправляется это добавлением к стилям блока свойства width с фиксированным значением, равным ширине изображения.
Условия: а) одно/несколько изображений различной ширины; б) подрисуночная подпись длиннее ширины изображения.
Можно воспользоваться свойством display: table-cell
#images_description
{
display: block;
float: left;
margin: 0 1em 2em 0;
padding: 0;
position: relative;
}
.images_description
{
display: table-cell;
width: 1px;
padding: 0;
}
.images_description .description
{
display: block;
font-size: 15px;
line-height: 1.3;
margin: 0;
padding: 0;
}
Размещение изображения и подрисуночной подписи на странице.
<div id="images_description">
<div class="images_description">
<img src="путь к изображению" alt="описание изображения" />
<span class="description">Подрисуночная подпись, которая переносится
на другую строчку</span>
</div>
</div>