ТЕКСТ...(прокрутка появится после заполнения рамочки текстом)

Серия сообщений "рамочки по формуле":

Часть 1 - Рамочки цветочные
Часть 2 - Рамочка: "Люблю цветы, их радужные краски..."
Часть 3 - Рамочка: "Отрада для души прекрасные соцветья..."

***Здесь будет текст с прокруткой***

<center><table style="width: 800px; border-radius: 20px 20px 20px 20px; box-shadow: inset rgba(0,0,0,.5) 0 -4px 5px, inset rgba(252,255,255,.5) 0 4px 7px, -7px 18px 36px -20px #ffffff;" cellspacing="0" cellpadding="0"><center><table style="width: 800px; border-radius: 20px 20px 20px 20px; box-shadow: inset rgba(0,0,0,.5) 0 -4px 5px, inset rgba(252,255,255,.5) 0 4px 7px, -7px 18px 36px -20px #000000;" background="//img0.liveinternet.ru/images/attach/d/2/147/742/147742776_0_24040_4ad1fbb2_orig.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:1px" zzz="zzz" align="right"><table style="background-image: url(''); cellspacing=" cellpadding="0" width="500"><tr><td style="padding: 0px" zzz="zzz" align=""><div style="float:right; margin-top: 5px; margin-left: 10px; margin-bottom: 5px; margin-right: 0px; "><center><table style="background-image: url('//img0.liveinternet.ru/images/attach/d/2/147/762/147762418_4c5ca37df160.jpg');border-radius: 20px 20px 20px 20px;" cellspacing="0" cellpadding="0" width="380"><tr><td style="padding:0px" zzz="zzz" align="center"><table width="380" height="700" style=" box-shadow: inset 1px 1px 20px #390000;border-radius: 20px 20px 20px 20px;" background="" cellspacing="0" cellpadding="0"><td style="padding:3px" zzz="zzz" align="center"><div style="width: 100%; height: 550px; margin-top: 0px; margin-left: 0px; text-align: center; font-size: 30px; overflow: auto"><span style="font-family:Vesna;color:#FFFFCC;font-size:23px;text-shadow: 0px 0px 0px #000000;"><br /><br /> ***Здесь будет текст с прокруткой***</span><center><a target="_blank" href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=//www.liveinternet.ru/users/5142306/" title="Люба-Любушка"><img src="//img-fotki.yandex.ru/get/6614/39663434.262/0_7d5db_cd8cdaeb_orig.gif" /></a></center></div></td></table></td></tr></table></center></div></td></tr></table></td></tr></table></center></table></center>

***Здесь будет текст с прокруткой***

<center><table style="width: 800px; border-radius: 20px 20px 20px 20px; box-shadow: inset rgba(0,0,0,.5) 0 -4px 5px, inset rgba(252,255,255,.5) 0 4px 7px, -7px 18px 36px -20px #ffffff;" cellspacing="0" cellpadding="0"><center><table style="width: 800px; border-radius: 20px 20px 20px 20px; box-shadow: inset rgba(0,0,0,.5) 0 -4px 5px, inset rgba(252,255,255,.5) 0 4px 7px, -7px 18px 36px -20px #000000;" background="//img0.liveinternet.ru/images/attach/d/2/147/703/147703300_0_282ba_f50474ba_orig.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:1px" zzz="zzz" align="right"><table style="background-image: url'('); cellspacing=" cellpadding="0" width="500"><tr><td style="padding: 0px" zzz="zzz" align=""><div style="float:right; margin-top: 5px; margin-left: 10px; margin-bottom: 5px; margin-right: 0px; "><center><table style="background-image: url('//img1.liveinternet.ru/images/attach/d/2/147/715/147715075_3efd5a6c155b.jpg');border-radius: 20px 20px 20px 20px;" cellspacing="0" cellpadding="0" width="380"><tr><td style="padding:0px" zzz="zzz" align="center"><table width="380" height="700" style=" box-shadow: inset 1px 1px 20px #390000;border-radius: 20px 20px 20px 20px;" background="" cellspacing="0" cellpadding="0"><td style="padding:3px" zzz="zzz" align="center"><div style="width: 100%; height: 550px; margin-top: 0px; margin-left: 0px; text-align: center; font-size: 30px; overflow: auto"><span style="font-family:Vesna;color:#390000;font-size:23px;text-shadow: 0px 0px 0px #000000;"><br /><br /> ***Здесь будет текст с прокруткой***</span><center><a target="_blank" href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=//www.liveinternet.ru/users/5142306/" title="Люба-Любушка"><img src="//img-fotki.yandex.ru/get/6614/39663434.262/0_7d5db_cd8cdaeb_orig.gif" /></a></center></div></td></table></td></tr></table></center></div></td></tr></table></td></tr></table></center></table></center>

***Здесь будет текст с прокруткой***

<center><table style="width: 800px; border-radius: 20px 20px 20px 20px; box-shadow: inset rgba(0,0,0,.5) 0 -4px 5px, inset rgba(252,255,255,.5) 0 4px 7px, -7px 18px 36px -20px #ffffff;" cellspacing="0" cellpadding="0"><center><table style="width: 800px; border-radius: 20px 20px 20px 20px; box-shadow: inset rgba(0,0,0,.5) 0 -4px 5px, inset rgba(252,255,255,.5) 0 4px 7px, -7px 18px 36px -20px #000000;" background="//img0.liveinternet.ru/images/attach/d/2/147/700/147700246_84306355_SHEMA_ROZOVUYE_CVETUY_BOLSHIE_v_RRRRyoS.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:1px" zzz="zzz" align="right"><table style="background-image: url'('); cellspacing=" cellpadding="0" width="500"><tr><td style="padding: 0px" zzz="zzz" align=""><div style="float:right; margin-top: 5px; margin-left: 10px; margin-bottom: 5px; margin-right: 0px; "><center><table style="background-image: url('//img0.liveinternet.ru/images/attach/d/2/147/762/147762890_0_bfdda_c28b1303_L.jpg');border-radius: 20px 20px 20px 20px;" cellspacing="0" cellpadding="0" width="380"><tr><td style="padding:0px" zzz="zzz" align="center"><table width="380" height="700" style=" box-shadow: inset 1px 1px 20px #800000;border-radius: 20px 20px 20px 20px;" background="" cellspacing="0" cellpadding="0"><td style="padding:3px" zzz="zzz" align="center"><div style="width: 100%; height: 550px; margin-top: 0px; margin-left: 0px; text-align: center; font-size: 30px; overflow: auto"><span style="font-family:Vesna;color:#800000;font-size:23px;text-shadow: 0px 0px 0px #000000;"><br /><br /> ***Здесь будет текст с прокруткой***</span><center><a target="_blank" href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=//www.liveinternet.ru/users/5142306/" title="Люба-Любушка"><img src="//img-fotki.yandex.ru/get/6614/39663434.262/0_7d5db_cd8cdaeb_orig.gif" /></a></center></div></td></table></td></tr></table></center></div></td></tr></table></td></tr></table></center></table></center>

***Здесь будет текст с прокруткой***

<center><table style="width: 800px; border-radius: 20px 20px 20px 20px; box-shadow: inset rgba(0,0,0,.5) 0 -4px 5px, inset rgba(252,255,255,.5) 0 4px 7px, -7px 18px 36px -20px #ffffff;" cellspacing="0" cellpadding="0"><center><table style="width: 800px; border-radius: 20px 20px 20px 20px; box-shadow: inset rgba(0,0,0,.5) 0 -4px 5px, inset rgba(252,255,255,.5) 0 4px 7px, -7px 18px 36px -20px #000000;" background="//img0.liveinternet.ru/images/attach/d/2/147/762/147762898_128078491_9cfrXZx.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:1px" zzz="zzz" align="right"><table style="background-image: url'('); cellspacing=" cellpadding="0" width="500"><tr><td style="padding: 0px" zzz="zzz" align=""><div style="float:right; margin-top: 5px; margin-left: 10px; margin-bottom: 5px; margin-right: 0px; "><center><table style="background-image: url('//img1.liveinternet.ru/images/attach/d/2/147/762/147762899_SRRSRRRSR_SRRRS__16__edorig_1323099.png');border-radius: 20px 20px 20px 20px;" cellspacing="0" cellpadding="0" width="380"><tr><td style="padding:0px" zzz="zzz" align="center"><table width="380" height="700" style=" box-shadow: inset 1px 1px 20px #800000;border-radius: 20px 20px 20px 20px;" background="" cellspacing="0" cellpadding="0"><td style="padding:3px" zzz="zzz" align="center"><div style="width: 100%; height: 550px; margin-top: 0px; margin-left: 0px; text-align: center; font-size: 30px; overflow: auto"><span style="font-family:Vesna;color:#800000;font-size:23px;text-shadow: 0px 0px 0px #000000;"><br /><br /> ***Здесь будет текст с прокруткой***</span><center><a target="_blank" href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=//www.liveinternet.ru/users/5142306/" title="Люба-Любушка"><img src="//img-fotki.yandex.ru/get/6614/39663434.262/0_7d5db_cd8cdaeb_orig.gif" /></a></center></div></td></table></td></tr></table></center></div></td></tr></table></td></tr></table></center></table></center>

Серия сообщений "разные ч.2":

***МОИ РАМОЧКИ***

Часть 1 - Рамочки объемные розовая цветочная и сиреневая классика
Часть 2 - Рамочки необычные Винтаж
...
Часть 46 - Рамочки для постов Фигурные-5 штук
Часть 47 - Рамочка "Одуванчики"
Часть 48 - Рамочки с ромашками с прокруткой 4 штуки

Всем привет!

Часто приходит вопрос : Как сделать текст с прокруткой в флейме?

Попробую объснить)

Сначала пишите нужный Вам текст, редактируете его по своему усмотрению, после чего в самое начало (перед Вашим текстом) вставляете вот этот код:

Значения указанные цифрами:

1 - это ширина текста по отношению к странице, сейчас стоит 100% - если хотите чтоб было меньше просто поменяйте цифру. Да и если Вам по какой-то причине не нравиться делать в процентах, то вы всегда можете изменить % на px.
2 - это высота видимого текста, стоит 300, можете по необходимости менять в большую или меньшую сторону.
3 - это отступ сверху от начала сообщения, сейчас стоит 0, если хотите, то можете поменять и флейм с текстом опустится на нужное Вам значение.
4 - это отступ с левой стороны, стоит 0, так же можете поменять на нужное Вам значение.

Пример) убираем весь текст во флейм, чтоб сократить длинну поста я уменьшила высоту прокрутки до 100px и поменяла отступ сверху с 0 на 20px

C этим разобрались, теперь отвечу на второй вопрос -

Как вставить прокрутку в рамочку?

Если у Вас стоит картинка в самом верху рамочки по центру, то делаете всё так же как описано выше - вставляете код в рамочку перед Вашим текстом.

Как вставить прокрутку в рамочку? Если у Вас стоит картинка в самом верху рамочки по центру, то делаете всё так же как описано выше - вставляете код в рамочку перед Вашим текстом. Если у Вас картинка слева или справа рамочки и Вы не хотите, чтоб было пустое пространство рядом с ней, то нужно изменить код. Возьмём для примера вот эту рамочку со вставленной в неё прокруткой:  Первое, что Вам нужно поменять, так это отступ с левой стороны, потом ширину и высоту прокрутки, для этого нужно знать размер картинки. В этой рамочке это 300х209, значит 4 пункт (отступ слева) мы меняем на 310, а 2 пункт (высота прокрутки ) мы меняем, на 200. Ширину прокрутки (пункт 1) с 100% я поменяла на 350px (под ширину своего экрана) - Вы можете поменять на нужное Вам значение Дайтека

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

 Возьмём для примера вот эту рамочку со вставленной в неё прокруткой: 

Как вставить прокрутку в рамочку? Если у Вас стоит картинка в самом верху рамочки по центру, то делаете всё так же как описано выше - вставляете код в рамочку перед Вашим текстом. Если у Вас картинка слева или справа рамочки и Вы не хотите, чтоб было пустое пространство рядом с ней, то нужно изменить код. Возьмём для примера вот эту рамочку со вставленной в неё прокруткой:  Первое, что Вам нужно поменять, так это отступ с левой стороны, потом ширину и высоту прокрутки, для этого нужно знать размер картинки. В этой рамочке это 300х209, значит 4 пункт (отступ слева) мы меняем на 310, а 2 пункт (высота прокрутки ) мы меняем, на 200. Ширину прокрутки (пункт 1) с 100% я поменяла на 350px (под ширину своего экрана) - Вы можете поменять на нужное Вам значение Дайтека

Первое, что Вам нужно поменять, так это отступ с левой стороны, потом ширину и высоту прокрутки, для этого нужно знать размер картинки которые находятся в коде самой картинки. В этой рамочке это 300х209, значит 4 пункт (отступ слева) мы меняем на 310, а 2 пункт (высота прокрутки ) мы меняем, на 200. Ширину прокрутки (пункт 1) с 100% я поменяла на 350px (под ширину своего экрана) - Вы можете поменять на нужное Вам значение.

Дополнение)

Если Вы хотите поместить в прокрутку только часть своего поста, а не весь, то Вам нужно использовать вот эти тэги <pre> Ваш текст </pre>всё что находится между ними будет в прокрутке, что до них или после них в прокрутку входить не будет.

Вот вроде и всё) если что-то осталось не понятно, то пишите в комментах попробую объяснить подробней.

 

Как вставить ПРОКРУТКУ в пост.

Если Вы хотите добавить в свой пост много текста.Есть один вариант как это сделать, чтобы пост не занимал много места и его не нужно было убирать под КАТ.
Например как у меня в данном случае.Нужно просто вставить в пост прокрутку.

А теперь посмотрим из чего состоит прокрутка.
1.scrollbar-face-color - это цвет передней стороны панели прокрутки
2.scrollbar-shadow-color - это цвет нижней и правой граней панели прокрутки.
3.scrollbar-highlight-color - это цвет верхней и левой граней панели прокрутки
4.scrollbar-3dlight-color - это цвет отсвета.
5.scrollbar-track-color - это цвет полосы, по которой "ходит" панель прокрутки.
6.scrollbar-arrow-color - это цвет треугольника на верхнем и нижнем квадратах.
7.#FFFFFF - это коды цвета, которые можно менять.
Не обязательно использовать все теги.
Я использую только те при помощи которых можно поменять цвет прокрутки.

Чуть ниже можно скопировать код ПОСТА С ПРОКРУТКОЙ,
который Вы потом будете вставлять в свой пост.
В коде где написано. КОД КАРТИНКИ.
Загружаете картинку через Радикал фото.Код берёте под №1.
Меняете только размеры картинки width="480" height="280"
Если вставляете через Лиру тогда вам нужна только та часть кода,
что находится внутри кавычек.


Дальше! Там где написано РАЗМЕР ПРОКРУТКИ.
Меняем эту надпись на цифры размера КАРТИНКИ.
В моём случае height="280".
Тоесть вместо слов РАЗМЕР ПРОКРУТКИ я ставлю"280"
Это нужно для того чтобы прокрутка не вылезала за размеры картинки или не была меньше её.Хотя размер прокрутки можете делать любой.Так просто красивее.

Идём дальше.Где написано ФОН ДЛЯ ТЕКСТА.
можно поставить фон.
Так же через радикал фото код под №1.
Или через Лиру так же как мы вставляли код картинки.
В моём случае я не стала добавлять Фон для текста.

И самое основное.
Где написано ВАШ ТЕКСТ.
Пишите свой текст.
Но ПРОКРУТКА начинает появлятся тогда,когда написано много текста.
Вот и всё удачи вам в оформлении.

Код ПОСТ С ПРОКРУТКОЙ.<img data-cke-saved-src="КОД КАРТИНКИ" src="КОД КАРТИНКИ" width="480" height="280" align="left" /><div style="overflow:auto;scrollbar-arrow-color:#000000;scrollbar-base-color: #228B22; position: width:99%;height:РАЗМЕР ПРОКРУТКИpx;background-image:url(' ФОН ДЛЯ ТЕКСТА ');top:5px;text-align:left;text-indent:5pt"> ВАШ ТЕКСТ </div>

Серия сообщений "Разное":
Часть 1 - Коды оформления блога
Часть 2 - Как вставить ПРОКРУТКУ в пост
Часть 3 - Делаем баннер
Часть 4 - Ассорти новогодних ссылок
...
Часть 17 - Кнопочки-переходы для кулинарных постов. ►1◄
Часть 18 - Музыка ветра для сайта
Часть 19 - У щоденник

СДЕЛАТЬ ТЕКСТ С ПРОКРУТКОЙ ВО ФРЕЙМЕ... Фрейм - это очень нужное окошечко, куда можно спрятать длинный текст и читать его, прокручивая вниз. Наверняка уже встречали подобное. Сделать такое окошечко очень просто. Сначала пишете нужный Вам текст, затем в самое начало (перед Вашим текстом) вставляете вот этот код: <div style="width: 100%; height: 300px; margin-top: 0px; margin-left: 0px; text-align: center; font-size: 14px; overflow: auto"> В простом редакторе просто копируете и ставите, в расширенном нужно нажать ИСТОЧНИК и там вставить код.

Серия сообщений "Оформление текста":
Часть 1 - Меняем цвет под определённым участком текста
Часть 2 - КАК СДЕЛАТЬ СВОЮ НАДПИСЬ НА ИЗОБРАЖЕНИИ В ОНЛАЙН-ФОТОШОП
...
Часть 8 - ТЕКСТ МЕЖДУ КАРТИНОК
Часть 9 - roflbot!!1! (сайт для подписывания картинок)
Часть 10 - СДЕЛАТЬ ТЕКСТ С ПРОКРУТКОЙ ВО ФРЕЙМЕ...
Часть 11 - ШПАРГАЛКА ПО УВЕЛИЧЕНИЮ И УМЕНЬШЕНИЮ РАЗЛИЧНЫХ ШРИФТОВ
Часть 12 - ТАБЛИЦЫ (3 урока по созданию таблиц)
...
Часть 27 - Генератор блестящих анимированных надписей BLOG GIF
Часть 28 - Бесплатный онлайн сервис ImageChef
Часть 29 - Генератор живого текста Screedbot

Серия сообщений "Генераторы":
Часть 1 - КНОПКИ, ЛОГОТИПЫ, ШРИФТЫ
Часть 2 - Создание анимации из ваших фоток
...
Часть 7 -
Часть 8 - ПАЛИТРЫ ЦВЕТОВ
Часть 9 - СДЕЛАТЬ ТЕКСТ С ПРОКРУТКОЙ ВО ФРЕЙМЕ...
Часть 10 - Онлайн сервис Glitterfy (создание аватарки с блёстками и надписью)
Часть 11 - ОНЛАЙН СЕРВИСЫ ДЛЯ РАБОТЫ С ИЗОБРАЖЕНИЕЯМИ
...
Часть 47 - Генератор аниминированных подписей онлайн
Часть 48 - Генераторы Color Hunter, Color Palette Generator; HTML Color Codes и Skillsup
Часть 49 - Онлайн сервис Noise Texture Generator // Генератор создания бесшовных текстур /