Оформление текста (все коды в окошечках)

Воскресенье, 15 Сентября 2013 г. 20:04 + в цитатник

Увеличить текст (+2,3 и т.д.), уменьшить (-2,3 и т.д.)
<font size="+2">текст</font>

<b><i><center>Текст</center></i></b>

<strong>Текст</strong><br />

<audio src="http://music-pesni.com/music/db3ca9007f08663a93f729b0b52d4154.mp3" controls="controls"></audio>

Курсор птичка
<font style="cursor:URL('//img0.liveinternet.ru/images/attach/c/9/106/31/106031546_ptichka.png'),auto;"></font>

Окошечко для вставки кода
rows и cols определяют площадь окна (ширину и высоту):
<textarea rows="1" cols="30">ВАШ КОД /textarea <>

Вставить флеш в окошко:
<center><input type="text" size="10" value="[====]" /></center>
[Звездочка*flash=500,500,АДРЕС ФЛЕШКИ]

ФОН под ЗАПИСЬ (цвет меняем по желанию)
<table background="https://img-fotki.yandex.ru/get/39073/65387414.a79/0_178efc_874ed3ec_S"><tr><td><center> Ваше Ф О Т О <font size="4"><font color="9d0a0f"><b><center><br /> Ваш Т Е К С Т или картинки<br /> </center></b></font></font></center></td></tr></table>

Подписываем картинку:

Выделение текста

Фон для записи:

<table background="https://img-fotki.yandex.ru/get/39073/65387414.a79/0_178efc_874ed3ec_S"><tr><td><center> Ваше Ф О Т О <font size="4"><font color="9d0a0f"><b><center><br /><br />
Ваш Т Е К С Т или картинки<br /><br />
</center></b></font></font></center></td></tr></table><br />
=================<br />
***********************<br />
<table background="//img-fotki.yandex.ru/get/6430/65387414.101/0_c5eb2_ef3a6d50_S"><tr><td><font size="4"><font color="9d0a0f"><b><center><br />
Фото, текст, музыка<br />
<table><td><td><a href="#" title="Прослушать запись" onClick="window.open('https://www.liveinternet.ru/flash/mjupl4li.swf?auto_run=1&playlist=http%3A%2F%2Fwww.liveinternet.ru%2Fplaylist.php%3Fa%3Done_file%26artist%3D%26title%3D%26url%3D%2F%2Fimg1.liveinternet.ru%2Fimages%2Fattach%2Fd%2F0%2F%2F5169%2F5169646_igor_ashurov__tuy_beregi.mp3', '_blank', 'left=100,top=100,width=350,height=100,location=0,menubar=0,resizable=0,scrollbars=1,status=0,toolbar=0');return (false);" ><img  alt="Прослушать запись" style="margin:0px;" align="left" src="//i.li.ru/4Ek/i/diary/fls/mp3.gif" width=100 height=20 border="0" />  <a title="Скачать файл"  href='http://liveinternet.ru/click?//img1.liveinternet.ru/images/attach/d/0//5169/5169646_igor_ashurov__tuy_beregi.mp3'><img alt="Скачать файл" style="margin:0px;" align="left" src="//i.li.ru/4Ek/i/diary/fls/down.gif" width=100 height=20 border="0" /></a></td></tr></table><br />
</center></b></font></font></td></tr></table>

"Закрепитель":
текст остается таким, каким вы его пишете

***
Как сделать, чтобы текст «обтекал» картинку?

***Картинка слева, текст справа:
добавляем в код картинки: align=left hspace=20

*** align=left – картинка слева, текст справа
***align=right - картинка справа, текст слева
***hspace=20 - расстояние между текстом и картинкой
20 пиксел по горизонтали
***vspace=20 - расстояние между текстом и картинкой
20 пиксел по вертикали

Картинка с плавным обтеканием текстом
справа и снизу (или сверху):

Рамочка с прокруткой:

Выравнивание текста по правому краю поста:

Выравнивание текста по всей ширине поста:

Отступ (для цитат и определений, текст отделен
пустой строкой и отступ слева 8 пробелов):

Бегущая строка:

Код бегущей картинки:

ЛИНИИ в ТЕКСТЕ:
Код ПРОСТОЙ линии

Код ЦВЕТНОЙ линии

Задать ТОЛЩИНУ линии
>

Линия ЦВЕТНАЯ с ЗАДАННОЙ ШИРИНОЙ

ГОРИЗОНТАЛЬНАЯ разделительная линия (половинка)

ССЫЛКИ:
Как вставить ссылку на веб-страницу:

Как сделать, чтобы картинка
была ссылкой на веб-страницу:

Как вставить ссылку на веб-страницу,
чтоб она открылась в новом окне:

Выделение цитаты С ЭФФЕКТОМ ПОДСВЕТКИ
(наведите курсор на текст):

Разбить текст на две колонки:

Текст обтекаемый другим текстом:

Написать текст имея фоном картинку:

Выравнивание текста по обеим сторонам:

Бегущая строка с заданной скоростью:
ОБЫЧНАЯ бегущая строка:

Чтобы изменить скорость движения строки,
измените цифру движения (1,2,3 и т.д.)
МЕДЛЕНО бегущая строка:

БЫСТРО бегущая строка:

НАПРАВЛЕНИЕ текста ВПРАВО:

Бегущая строка на фоне, который тоже можно менять:
(направление ВЛЕВО)

Направление АЛЬТЕРНАТИВНОЕ:

Бегущяя строка с ССЫЛКОЙ:

Коды бегущей строки можно менять
(цвет, ширину, высоту, направление)

Кнопка "Далее" (красная):

Тоже всегда нужно иметь под рукой:

Таблица на 4 картинки в ряд:

Таблица на 3 картинки в ряд:

Таблица на 2 картинки в ряд:

Столбик с ТОЧКАМИ:

Подписываем КАРТИНКУ:

ТЕКСТ в ДВА столбика !!!

Кнопка "Далее" (зеленая):

Шрифт:

Курсор с картинкой к записи:

Формула наложения флеш на картинку:

Cлова ШИРИНА и ВЫСОТА КАРТИНКИ,
надо заменить на свои значения (согласно выбранной картинки.

MARGIN-TOP: -530px - ЭТО ВЫСОТА ДВИЖЕНИЯ ФЛЕШ. Как видите она со знаком -, поэтому чем меньше ее значение, тем ниже опустится начало движения флеш, ( и картинка у вас будет повторятся) и наоборот, чем больше ее значение, тем выше будет поднято движение флеш.

То есть если на примере сердечки (там где картинка клипарт), начинают подниматься снизу картинки, если УВЕЛИЧИТ значение 530px, то сердечки поднимутся, и начнут свое движение от середины картинки, и выше, захватывая текст, и наоборот! Опытные пользователи могут это значение регулировать и сами определять область захвата флеш. Новичкам же советую это значение ставить ПO ВЫСОТЕ КАРТИНКИ, чтоб ее не исказить.

Ну и вместо слов КОДЫ ВСТАВКИ ФЛЕШ,
вставьте эти коды. То есть ширину, высоту и адрес флеш (все через запятую, вот так).
[flash=ВЫСОТА ФЛЕШ,ШИРИНА ФЛЕШ,АДРЕС ФЛЕШ]
ВЫСОТУ и ШИРИНУ ФЛЕШ, ставьте тоже по ширине и высоте картинки. Флеш без фона можно ставить на любые картинки, как анимированные, так и простые, в том числе и на клипарт.

ОБРАЗЕЦ:

Красивые флеш на прозрачном фоне,
можно взять например здесь:
http://www.liveinternet.ru/users/misskcu/rubric/2974983/
http://www.liveinternet.ru/users/daf53/rubric/2661826/

Адреса ссылок на флеш МОЖНО ВЗЯТЬ ЗДЕСЬ Спасибо автору Ledi Vlada

КАРТИНКА МЕЖДУ ТЕКСТОМ:

ТЕКСТ МЕЖДУ КАРТИНКАМИ:

КАРТИНКА В (левом) ВЕРХНЕМ УГЛУ ЗАПИСИ:

КАРТИНКА В (правом) ВЕРХНЕМ УГЛУ ЗАПИСИ:

КОД ПРОКРУТКИ:

В коде размеры прокрутки можно менять.
Прокрутку можно ставить и в рамочки, и без нее.

Рамочка с прокруткой на белом фоне:

Цвет фона можно изменить, изменив (адрес фона)
=- (700x221, 81Kb)

Вариант самой ОБЫЧНОЙ ПРОКРУТКИ

Цветная прокрутка

Прокрутка в рамочке
КОД с ПРОКРУТКОЙ и КАРТИНКОЙ

Вертикальный разделитель между текстами

Образец:

ТЕКСТ №1 ОДИН

ТЕКСТ №2 ДВА

Картинки в ряд без использования таблицы:
Используя тег nobr - можно вставить любое количество картинок в одну строку, но нужно следить за количеством.
В новой строке опять пишем эти теги и вставляем следующий ряд фоток. И так далее.

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

Код картинки со ссылкой на оригинал:

Чтобы уменьшенная картинка (превью) развернулась прямо
на странице поста, нужно в код ссылки прописать
rel="li-bigpic"

Текст с отступом от края в 8 пробелов

Абзац

Текст справа в несколько строк
с выравниванием СПРАВА

Текст справа в несколько строк
с выравниванием СЛЕВА

Бегущая влево строка (и/или картинка!)

Бегущая вправо строка (и/или картинка!)

Список - жирная точка спереди

Формирование списка по пунктам

Чтобы ссылка открылась в новом окне:

Если вам нужно чтобы КАРТИНКА была ссылкой -

Текст со всплывающей подсказкой

Скользящий вниз текст

Ставим в один ряд несколько (три) ФЛЕШ

Код музыкальной открытки с текстом:

<div align="center"><table background="https://img-fotki.yandex.ru/get/6114/65387414.92b/0_156a63_519d1fcc_XL.gif"><tr><td width="590" height="555"><div align="right"><font size="4"><font color="9d0a0f">Что же ты осень так долго,без меры<br />-Льёшь слезинки дождя наугад?<br />За окном в тучах серое небо.<br />Кружит в танце свой вальс листопад.<br /><br />Может быть так прощаешься с летом,<br />И его возвращения ждёшь?<br />-Отшумело,сгорело,исчезло...<br />Дней прекрасных уже не вернёшь!<br /><br />Кружат в воздухе медленно листья,<br />Я по саду немного пройду.<br />Одиноко,тоскливо на сердце<br />-В позабытом,осеннем саду..<br /><br /><br /><br /><br/><IFRAME src="//flashframe.li.ru/showflash.html?tag_value=%2F%2Fwww.yapfiles.ru%2Ffiles%2F657436%2Fpleer131LuIra.swf%3Fmp3%3D%2F%2Fimg0.liveinternet.ru%2Fimages%2Fattach%2Fc%2F7%2F%2F4898%2F4898108_chto_takoe_osen.mp3&flash_width=44&flash_height=44&style=" width=44 height=44 style="width:44;height:44; border:0px outset;" scrolling="no" frameborder="0"></iframe></font></font></div></td></tr></table></div>

Код выше выложенной открытки
(вставляем свои значения):

Для того, что б музыка или текст стояли там, где нужно, ставим тег выравнивания, они ставятся прямо перед кодами тех значений, которые вы хотите выравнять (ТЕКСТОМ, КОДОМ ПЛЕЕРА) Это теги - справа, слева, в центре:

Вставляем БЛИНГИ, КАртинки и т.д.
---------------

-------------------

Копируем формулу из рамочки и вставив в простой редактор вставляем свои значения. Если надо ПОДНЯТЬ картинку ВВЕРХ, то тег ставится, НЕ перед кодами картинки, а ПОСЛЕ КОДА КАРТИНКИ ставим тег
, а при опускании картинки тег
ставим ПЕРЕД КОДОМ КАРТИНКИ

Картинок можно вставлять столько
сколько позволят размеры картинки-фона.

Можно ставить ТЕКСТ или МУЗЫКУ.
Как это сделать смотрите

Как наложить флеш на картинку

Можно ставить вместе и текст и картинку,
и еще добавить музыку)
Блинги можно использовать как фон их можно

Цвет плеера и музыку можно менять!!!

Серия сообщений "ВСЕ_для_БЛОГА":
Часть 1 - Рамочка рабочяя и др.
Часть 2 - Оформление текста (все коды в окошечках)
Часть 3 - Шрифты, HTML-коды / примеры с кодами
Часть 4 - Для постов и рамочек - сайты и генераторы для творчества
...
Часть 33 - Создать Gif-картинку из видео с YouTube
Часть 34 - Как обрезать видео на компьютере: подробная инструкция
Часть 35 - Как скачать видео с Rutube и выделить музыкальный файл