Итак, ниже представлены 4 примера обложек, я попыталась максимально подробно и понятно объяснить, что и как. Надеюсь, данная статья кому-то да пригодится. Если что-то непонятно — спрашивайте.
Как пример я взяла аннотацию книги Сьюзен Коллинз "Голодные игры".
Пример 1
Книга-сенсация, возглавившая 21 список бестселлеров и удостоенная множества литературных наград.
Эти парень и девушка знакомы с детства и еще могут полюбить друг друга, но им придется стать врагами... По жребию они должны участвовать в страшных 'Голодных играх', где выживает только один - сильнейший. Пока в жестком квесте остаются хотя бы какие-то участники, Китнисс и Пит могут защищать друг друга и сражаться вместе. Но рано или поздно кому-то из них придется пожертвовать жизнью ради любимого... Таков закон 'Голодных игр'. Закон, который не нарушался еще никогда!
Код для вставки:
<img width="200" height="250"> Книга-сенсация, возглавившая 21 список бестселлеров и удостоенная множества литературных наград.
<br> Эти парень и девушка знакомы с детства и еще могут полюбить друг друга, но им придется стать врагами... По жребию они должны участвовать в страшных 'Голодных играх', где выживает только один - сильнейший. Пока в жестком квесте остаются хотя бы какие-то участники, Китнисс и Пит могут защищать друг друга и сражаться вместе. Но рано или поздно кому-то из них придется пожертвовать жизнью ради любимого... Таков закон 'Голодных игр'. Закон, который не нарушался еще никогда!
Пример 2
Книга-сенсация, возглавившая 21 список бестселлеров и удостоенная множества литературных наград.
Эти парень и девушка знакомы с детства и еще могут полюбить друг друга, но им придется стать врагами... По жребию они должны участвовать в страшных 'Голодных играх', где выживает только один - сильнейший. Пока в жестком квесте остаются хотя бы какие-то участники, Китнисс и Пит могут защищать друг друга и сражаться вместе. Но рано или поздно кому-то из них придется пожертвовать жизнью ради любимого... Таков закон 'Голодных игр'. Закон, который не нарушался еще никогда!
Код для вставки:
<img width="200" height="250">
<br> Книга-сенсация, возглавившая 21 список бестселлеров и удостоенная множества литературных наград.
<br> Эти парень и девушка знакомы с детства и еще могут полюбить друг друга, но им придется стать врагами... По жребию они должны участвовать в страшных 'Голодных играх', где выживает только один - сильнейший. Пока в жестком квесте остаются хотя бы какие-то участники, Китнисс и Пит могут защищать друг друга и сражаться вместе. Но рано или поздно кому-то из них придется пожертвовать жизнью ради любимого... Таков закон 'Голодных игр'. Закон, который не нарушался еще никогда!
Пример 3
Книга-сенсация, возглавившая 21 список бестселлеров и удостоенная множества литературных наград.
Эти парень и девушка знакомы с детства и еще могут полюбить друг друга, но им придется стать врагами... По жребию они должны участвовать в страшных 'Голодных играх', где выживает только один - сильнейший. Пока в жестком квесте остаются хотя бы какие-то участники, Китнисс и Пит могут защищать друг друга и сражаться вместе. Но рано или поздно кому-то из них придется пожертвовать жизнью ради любимого... Таков закон 'Голодных игр'. Закон, который не нарушался еще никогда!
Код для вставки:
<table border="0" cellpadding="7" cellspacing="5">
<tr><td>
<img width="200" height="250"></td>
<td>Книга-сенсация, возглавившая 21 список бестселлеров и удостоенная множества литературных наград.
<p>Эти парень и девушка знакомы с детства и еще могут полюбить друг друга, но им придется стать врагами... По жребию они должны участвовать в страшных 'Голодных играх', где выживает только один - сильнейший. Пока в жестком квесте остаются хотя бы какие-то участники, Китнисс и Пит могут защищать друг друга и сражаться вместе. Но рано или поздно кому-то из них придется пожертвовать жизнью ради любимого... Таков закон 'Голодных игр'. Закон, который не нарушался еще никогда!</p>
</td>
</tr>
</table>
Пример 4 (похож на пример 3, но код другой)
Книга-сенсация, возглавившая 21 список бестселлеров и удостоенная множества литературных наград.
Эти парень и девушка знакомы с детства и еще могут полюбить друг друга, но им придется стать врагами... По жребию они должны участвовать в страшных 'Голодных играх', где выживает только один - сильнейший. Пока в жестком квесте остаются хотя бы какие-то участники, Китнисс и Пит могут защищать друг друга и сражаться вместе. Но рано или поздно кому-то из них придется пожертвовать жизнью ради любимого... Таков закон 'Голодных игр'. Закон, который не нарушался еще никогда!
Код для вставки:
<table><tr><td><img width="200" height="250" border="0" hspace="10" vspace="6" align="left">
<br><br>Книга-сенсация, возглавившая 21 список бестселлеров и удостоенная множества литературных наград.
<br>Эти парень и девушка знакомы с детства и еще могут полюбить друг друга, но им придется стать врагами... По жребию они должны участвовать в страшных 'Голодных играх', где выживает только один - сильнейший. Пока в жестком квесте остаются хотя бы какие-то участники, Китнисс и Пит могут защищать друг друга и сражаться вместе. Но рано или поздно кому-то из них придется пожертвовать жизнью ради любимого... Таков закон 'Голодных игр'. Закон, который не нарушался еще никогда!</td></tr></table>
Копируем выбранный вами код и вставляем в Аннотацию к книге:
Чтобы вставить картинку в код можно воспользоваться двумя способами:
1) добавить обложку через специализированный ресурс для публикации фотографий (Радикал, Smages.com, FastPic.ru или любой другой похожий сайт). Загружаете на один из выбранных сайтов картинку, копируете ссылку и вставляете в код. Но, часто бывает, что картинка загружается с 'белым' фоном, это зависит от формата картинки (.jpg, .png, .bmp). Как я заметила, в формате .png чаще загружается картинка без 'белого' фона. Можно, конечно, и в редакторе обрезать ненужное и оставить только то, что необходимо. А можно воспользоваться и вторым способом;
2) либо можно добавить обложку в иллюстрации к книге, затем нажать правой кнопкой мыши по картинке и выбрать Копировать URL картинки (см. картинку ниже). И скопированный URL вставляете в код.
Теперь рассмотрим некоторые понятия:
border — определяет рамку. Его значение равно нулю, т.к. если оно будет больше 0, то появится рамка как на рисунке ниже:
width — определяет ширину картинки, значение устанавливайте, какое посчитаете нужным.
height — определяет высоту картинки, значение устанавливайте, какое посчитаете нужным.
cellpadding — определяет расстояние (в пикселях) между рамкой каждой ячейки таблицы и содержащемся в ней материалом, его значение можно менять, как посчитаете нужным, либо вообще убрать его, но тогда обложка и текст будут максимально приближены друг к другу.
cellspacing — определяет расстояние (в пикселях) между границами соседних ячеек таблицы, его значение также можно менять, как посчитаете нужным, либо вообще убрать его, но тогда обложка и текст будут максимально приближены друг к другу.
— используется в Примере 2, это знак пробела, можно также использовать и в других примерах.
hspace — горизонтальный отступ в пикселях по горизонтали от картинки до других объектов.
vspace — вертикальный отступ в пикселях по вертикали от картинки до других объектов.