Оформляем текст и картинки

Четверг, 28 Октября 2010 г. 18:48 + в цитатник

Цитата сообщения KAMILA25

Прочитать целиком В свой цитатник или сообщество!

Без заголовка Оформляем текст и картинки

Картинка обтекаемая текстом

Не забывайте, что картинка должна быть не очень большой, иначе текст просто выдавит ее вверх. цифровые значения vspace="10" и hspace="10"- это всего навсего расстояние от картинки к тексту вправо и вниз, можно их менять, по вашему вкусу.

Код обтекания картинки текстом
<img src="httр:адрес картинки" align="left" vspace="10" hspace="30" alt=>"здесь нет картинки, хотя должно быть изображение. Какое оно будет, решать вам"

Картинка слева от текста

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

Код картинки слева

<img src="URL адрес картинки" align="left" border="0"> И снова пишем свой текст, или стихотворение, или.... придумали? молодцы!

Картинка справа от текста:

Все правила написания для правой стороны такие же , как и для левой.

Код для картинки с права:

<img src="URL адрес картинки" align="right" border="0">Пишем свой текст, что напишем, то и увидим

Картинка в центре текста:
Обратите внимание, что текст пишется перед кодом и после кода. Это для того, чтобы обтекание было полноценным,

и как бы обкутывало вашу картинку. Поэтому, часть текста вверху, часть внизу и создают такой эффект.

Код для картинки в центре текста:
Первая часть текста <img src="URL адрес картинки" align="middle" border="0"> Вторая часть текста.

Текст между двух картинок

Чтобы текст лег красиво, нужно, чтобы картинки были по длине больше, чем по ширине, если текст выйдет за рамки рисунков, он уйдет вниз.

Код для текста между двух картинок
<table align=center border=0>
<tr>
<td><img src="URL адрес КАРТИНКИ"></td>
<td>Текст, который красиво расположится между картинками.</td>
<td><img src="URL адрес КАРТИНКИ"></td>
</tr>
</table>

Картинка между текстом

Красиво получается, когда картинка находится между текстом, как-то необычно.

Главное, чтобы текст соответствовал, и картинка отражала его суть. Остальное - полет фантазии

Код для картинки между текстом
<table align=center border=0>
<tr>
<td>ТЕКСТ</td>
<td><img src="URL адрес КАРТИНКИ"></td>
<td>ТЕКСТ</td>
</tr>
</table>

Блог Лиры

Серия сообщений "HTML":
Часть 1 - Это просто клад-3
Часть 2 - Тренировка: области-ссылки на изображении
...
Часть 12 - Делаем часики под свой дизайн.
Часть 13 - Самый простой способ вставить в сообщение проигрыватель с музыкой
Часть 14 - Оформляем текст и картинки
Часть 15 - ЛиРу - как вставить флеш ( flash ) в пост? Как узнать прямую ссылку на флеш?

Серия сообщений "Полезное":
Часть 1 - ПОРТРЕТ, ПРИНОСЯЩИЙ СЧАСТЬЕ...
Часть 2 - Коллекция ссылок на качественные уроки по фотошоп
...
Часть 5 - Как изменить размер изображения или вырезать из него фрагмент
Часть 6 - Как загрузить Музыку к себе в дневник на Лиру.
Часть 7 - Оформляем текст и картинки
Часть 8 - Как вставить музыку с сайта «privet.ru»?
Часть 9 - Куча красивых надписей
...
Часть 11 - Бродилка по дневнику Mademoiselle Viv
Часть 12 - В КАКИЕ ЦЕРКОВНЫЕ ПРАЗДНИКИ НЕЛЬЗЯ ШИТЬ, ВЯЗАТЬ, ВЫШИВАТЬ?
Часть 13 - Как бесплатно активировать Касперского ежемесячно без ключа

Серия сообщений "Internet ссылки":
Часть 1 - ПОРТРЕТ, ПРИНОСЯЩИЙ СЧАСТЬЕ...
Часть 2 - Коллекция ссылок на качественные уроки по фотошоп
...
Часть 16 - Самый простой способ вставить в сообщение проигрыватель с музыкой
Часть 17 - Как делать полупрозрачные с обводкой фоны для дневников
Часть 18 - Оформляем текст и картинки
Часть 19 - Убираем ненужные объекты с фото! Онлайн!
Часть 20 - Фоны, фоны, фоны... от Lilas en flor
...
Часть 25 - В КАКИЕ ЦЕРКОВНЫЕ ПРАЗДНИКИ НЕЛЬЗЯ ШИТЬ, ВЯЗАТЬ, ВЫШИВАТЬ?
Часть 26 - Как бесплатно активировать Касперского ежемесячно без ключа
Часть 27 - КАК СДЕЛАТЬ КАРТИНКУ ССЫЛКОЙ НА ВАШ САЙТ,БЛОГ ИЛИ ВАШУ СТРАНИЧКУ?!УРОК

Серия сообщений "Для дневников, блогов":
Часть 1 - Перезаливаем флешки к себе и переписываем код
Часть 2 - Красивые календари в ваш дневник.
...
Часть 12 - Самый простой способ вставить в сообщение проигрыватель с музыкой
Часть 13 - Как делать полупрозрачные с обводкой фоны для дневников
Часть 14 - Оформляем текст и картинки
Часть 15 - Фоны, фоны, фоны... от Lilas en flor
Часть 16 - Как вставить музыку с сайта «privet.ru»?
Часть 17 - КАК СДЕЛАТЬ КАРТИНКУ ССЫЛКОЙ НА ВАШ САЙТ,БЛОГ ИЛИ ВАШУ СТРАНИЧКУ?!УРОК