Erdraug все записи автора
Для improved

Ранее ты обратился за помошью:

"помоги с Тэгами... надо чтобы текст в эпиграфе был сбоку от картинки..и чтобы был не в 1 строчку а столбиком..."

Это делается так:

Чтобы добиться разрыва текста с переходом на следующую строчку, достаточно вставить в нужном месте тег <br>.

Чтобы отредактировать расположение текста и картинки в эпиграфе есть два способа.

Способ 1 (простой)

Достаточно добавить атрибут align, который задает расположение графического изображения относительно текста, в тег <img>, содержащий ссылку на вашу картинку, и присвоить атрибуту соответствующее значение:
texttop - выравнивание верхнего края изображения по верхней линии текста,
abscenter - выравнивание центра изображения по центральной строки текста,
center - выравнивание центра изображения по нижней линии строки текста,
bottom - выравнивание базовой линии строки текста по нижнему краю изображения,
absbottom - выравнивание нижнего края изображения по нижней линии текста с учетом элементов символов, опускающихся ниже базовой линии,
left - расположение текста в левой части текстового потока,
right - расположение текста в правой части текстового потока.
Недостаток этого способа заключается в том, что при наличие более двух разнородных объектов предсказать их поведение сложно. Результат часто может сильно отличаться от ожиданий.

Способ 2

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

Понадобятся следующие теги:

<table> ... </table> - начальный и конечный теги таблицы
Возможные атрибуты:
background=URL - Задается фоновое изображение для таблицы.
bgcolor=цвет - Задается цвет фона ячейки.
cellpadding=n - Между границами ячейки и её содержимым поместить область свободного пространства шириной n пикселей.
cellspacing=n - Задается интервал между ячейками таблицы размером в n пикселей.
hspace=n - Задается размещение справа и слева от таблицы областей свободного пространства заданной ширины (в пикселях).
vspace=n - Задается размещение над таблицей и под ней областей свободного пространства

<tr> ... </tr> - начальный и конечный теги строки ячеек в таблице.
Возможные атрибуты:
align=тип - Задается способ выравнивания содержимого ячейки:
left - по левому краю;
center - по центру;
right - по правому краю.
background=URL - Задается фоновое изображение ячейки.
bgcolor=цвет - Задается цвет фона ячейки.
bordercolor=цвет - Задается цвет обрамления ячейки.
valign=тип - Задается размещение содержимого данной ячейки:
top - вверу;
center - по центру;
bottom - внизу;
baseline - по базовой линии ячейки.
<td> ... </td> - начальный и конечный теги данных в ячейке таблицы.
Возможные атрибуты:
align=тип - Задается способ выравнивания содержимого ячейки:
left - по левому краю;
center - по центру;
right - по правому краю.
background=URL - Задается фоновое изображение ячейки.
bgcolor=цвет - Задается цвет фона ячейки.
colspan=n - Данная ячейка охватывает n соседних столбцов.
rowspan=n - Данная ячейка охватывает n соседних строк.
valign=тип - Задается размещение содержимого данной ячейки:
top - вверу;
center - по центру;
bottom - внизу;
baseline - по базовой линии ячейки.
width=n - Установка ширины данной ячейки в пикселях или в процентах от ширины окна.

Что переписываем:

0) Прикидываем размерность таблицы, т.е. сколько в ней будет строк и столбцов.
1) Вставляем в поле эпиграфа теги таблицы <table> ... </table>.
2) Вставляем соответствующее количество тегов строк <tr> ... </tr> в нашу таблицу.
3) Вставляем теги ячеек <tb> ... </tb> в каждую строку таблицы, количество ячеек в строке должно соответствовать количеству столбцов таблицы.
В результате, получаем пустой макет таблицы.
пример: <table><tr><tb> ... </tb><tb> ... </tb></tr><tr><tb> ... </tb><tb> ... </tb></tr></table> - таблица 2х2
4)Теперь можно заполнять ячейки соответствующими объектами.

Далее я буду описывать частный случай заполнения таблицы, связанный с вопросом improved. Вы можете заполнять таблицу, исходя из собственных пожеланий.

0)Создадим макет таблицы 1х2, т.к. нам нужно разместить всего два объекта, выстроив их по горизонтали.
1)Вставим тег <img>, содержащий ссылку на нужную картинку, в первую ячейку.
2)Вставим текст во вторую ячейку.
3)Размер ячеек будет выбран автоматически, но лучше указать размер каждой ячейки вручную, что обеспечит единообразное отображение таблицы вне зависимости от расширения экрана.
4)Если не изменять размер ячеек вручную, текст в нашем таблице будет приклеен к правой стороне картинки. Решить эту проблему можно, указав в атрибутах таблицы размер свободного пространства между ячейками или между границами ячеек и объектами.
5)Чтобы добиться желаемого расположения текста в ячейке нужно вставить соответствующие атрибуты со значениями в эту ячейку.
6)Можно выбрать задний фон таблицы, отличный от настроек дневника. Для этого нужно вставить соответствующий атрибут в тег таблицы. В нашей таблице я выбрал черный фон, соответствующий основному цвету картинки, чем добился визуального объединения содержащихся в таблице объектов. Можно так и не делать...
7)Шрифт и цвет любой части текста также можно изменить по собственному усмотрению, используя тег <font>..изменяемый текст..</font>. В нашей таблице я выбрал цвет текста "silver", соответствующий цвету текста дневникаimproved, но отличный от цвета текста дневника данного сообщества. Весь текст в этом посте должен был быть голубым :( Так тоже можно не делать...

Теперь сравните код в эпиграфе:

Исходный код:

<img src="http://img.liveinternet.ru/images/attach/4/11771/11771499_image_fil_kartinki_12.jpg" width="600" height="312" alt=" (600x312, 19Kb)" />
<font size="3"><font face="times new roman"><font color="silver"><b>
...Wind or Air...
...Force or Will...
...Wisdom or Power...
...Breath In or Out...
...Sunset or Sunrise...
...Love or Passion...
</b></font></font></font>

Исправленный код:

<table bgcolor="000000" cellpadding="5"><tr><td><img src="http://img.liveinternet.ru/images/attach/4/11771/11771499_image_fil_kartinki_12.jpg" /></td><td align="centet" valign="center"><font color="silver" size="3" face="times new roman">...Wind or Air...<br />...Force or Will...<br />...Wisdom or Power...<br />...Breath In or Out...<br />...Sunset or Sunrise...<br />...Love or Passion...</font></td></tr></table>

После внесения изменений результат будет следующий:

...Wind or Air... ...Force or Will... ...Wisdom or Power... ...Breath In or Out... ...Sunset or Sunrise... ...Love or Passion...