Много фонов на разные темы с сайта lenagold от Шадриной Галины.
Большая коллекция фонов на все темы.

БОЛЬШАЯ КОЛЛЕКЦИЯ ФОНОВ на все темы. Алфавитный каталог А • Автомобили • Аисты • Акулы • Ангелы • Анютины глазки • Апельсины • Архитектурные украшения • Африканцы Г • Бабочки • Барельефы • Бокалы • Бревна • Бумага • Буквы • Букеты • Бутылки Смотри далее

Серия сообщений "Ссылки"

Часть 1 - Женские и мужские журналы
Часть 2 - Интересные и нужные сайты на любой вкус
Часть 3 - БОЛЬШАЯ КОЛЛЕКЦИЯ ФОНОВ на все темы
Часть 4 - Красивые обложки в мой мир - для моего мира - МАЙЛА !!!
Часть 5 - Ссылки на сайты с орнаментами и узорами. Орнаменты разных стилей и эпох...
...
Часть 25 - ВСЕ ПОПУЛЯРНЫЕ СЛОВАРИ В ОДНОМ МЕСТЕ
Часть 26 - Интересные сайты сети интернет
Часть 27 - Нужные и интересные сайты

Серия сообщений "Фоны для блогов":

Часть 1 - Оригинальные черные фоны
Часть 2 - БОЛЬШАЯ КОЛЛЕКЦИЯ ФОНОВ на все темы
Часть 3 - Глиттеры всех цветов и расцветок
Часть 4 - Глянцевые фоны всех цветов
...
Часть 19 - Генератор создания фонов в полосочку.
Часть 20 - Бесшовные фоны для Вашего сайта
Часть 21 - Лучшие сайты с фонами
 

Фоны с рельефным рисунком от Шадриной Галины.
Фоны, которые не будут отвлекать внимание от написанного текста

Подборка бесшовных ФОНОВ, со слегка выбитым рисунком, которые не будут отвлекать внимание от написанного текста, так как они не отличаются особой эффектностью. - Цветовой оттенок и текстура у них едва выражены. Как взять адрес фона в другом размере с альбомов на Яндекс.Фотках СМОТРИМ ЗДЕСЬ

Серия сообщений "Фоны для блогов"

Часть 1 - Оригинальные черные фоны
Часть 2 - БОЛЬШАЯ КОЛЛЕКЦИЯ ФОНОВ на все темы
...
Часть 10 - Оригинальные объемные бесшовные фоны всех цветов
Часть 11 - Коллекция черных фонов , с летящимм снегом.
Часть 12 - Фоны, которые не будут отвлекать внимание от написанного текста
Часть 13 - Красивые рельефные фоны
Часть 14 - Необычные и красивые фоны для дизайна
...
Часть 19 - Генератор создания фонов в полосочку.
Часть 20 - Бесшовные фоны для Вашего сайта
Часть 21 - Лучшие сайты с фонами

Текстовые рамочки для рецептов выпечки.
Рамочка "Выпечка"

ВАШ ТЕКСТ

Nata Vi

Код рамочки:

Далее 2 рамочки без божьей коровки и без анимации...

Текстовая рамочка для праздничных рецептов.
Рамочка "Праздничный стол"

А здесь будут Ваши рецепты праздничных блюд

Nata Vi

Код рамочки:
Далее ещё три кода вариантов этой рамки...

Текстовая рамка для рецептов домашних заготовок на зиму.
Рамочка кулинарная "Рецепты консервации."

... ВАШ ТЕКСТ...

Текстовая рамочка кулинарная в форме домика.
Рамка для рецепта *Домик*.
 

Название Вашего поста
Картинка
(её ширина не должна быть шире текстового поля рамки 340пик)
Сам пост (После того, как вы вставите свой текст,все мои слова удалите. )
По мере заполнения рамки текстом появится прокрутка справа

<center><div style="background:url('//img-fotki.yandex.ru/get/9171/50114850.531/0_d81d2_ad51c938_XL.png.jpg') top left no-repeat; padding-top:130px; height:450px; width:620px"><div style="width:300px; height:360px; padding:0 145px 0 175px; font: 16px Arial; font-style: italic; color: #547E2D; overflow:auto; text-align:center"><br /> <center><b>Название Вашего поста</b><br /> Картинка (её ширина не должна быть шире текстового поля рамки 300пик)<br /> Сам пост (После того, как вы вставите свой текст,все мои слова удалите. )<br /> По мере заполнения рамки текстом появится прокрутка справа</center></div><center><a title="Kantemiirina" data-cke-saved-href="http://www.liveinternet.ru/users/irinardt/rubric/3437983/" href="http://www.liveinternet.ru/users/irinardt/rubric/3437983/" target="_blank"><img data-cke-saved-src="//img-fotki.yandex.ru/get/4410/50114850.277/0_78c30_28ccf020_XS.jpg" src="//img-fotki.yandex.ru/get/4410/50114850.277/0_78c30_28ccf020_XS.jpg" alt="" align="center" /></a></center></div></center>

Kantemirova Irina

 

Серия сообщений "Рамочки для рецептов":

Часть 1 - Рамочка для записи рецептов
Часть 2 - Кулинарная рамочка
...
Часть 32 - Рамка для рецепта *Разделочная доска*
Часть 33 - Рамки для рецептов *Весёлые овощи*
Часть 34 - Рамка для рецепта *Домик*
 

Как вставить изображение в рамочку?
Рамка вокруг изображения

С помощью CSS можно вокруг любого изображения сделать симпатичную
рамку-обводку. Поскольку у стилевого свойства border есть несколько значений,
то и рамочки могут быть разными по стилю, цвету и толщине.

Название цвета указываем по-английски. Значения меняем в строке:
style="border: 10px double Blue", где 10 — толщина, double — стиль, Blue — цвет.
Сначала покажу примеры рамок, а ниже представлю их коды.

Вариант 1

Изображение заключено в двойную рамку: стиль double;

Смотрим дальше

Как создать окно для кода? Формула.
Делаем Окошко для кодов.
 

Этот урок как делать окошко для кодов. Очень полезная штука и удобная.Можно быстро скопировать код и занимает мало места.Очень хорошо подходит для рамочек. Если у вас получилась красивая рамка и хочется поделиться с другими её кодом. Выглядеть окошко без кода будет так.ВАШ КОД SvetlanaT

 

Бегущий текст в рамочке. Уроки от Татьяны Егоровой.
Бегущий текст

БЕГУЩИЙ ТЕКСТ

Попросили сделать урок с таким вот бегущим текстом как в рамочке ниже

рамочка от Егоровой Татьяны..................................................коллаж от Sabine Astana Здесь будет Ваш текст

Код этой готовой рамочки <table style="border:8px ridge #990000" background="//img0.liveinternet.ru/images/attach/c/10/126/936/126936420_3c274277008c.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:10px"><center><b><a target="_blank" href="http://www.egorovatatiana.ru/"><font color="#f5989d"><font size="1">рамочка от Егоровой Татьяны</font></font></a><font color="#9d0039"><font size="1">..................................................</font></font><a target="_blank" href="//www.liveinternet.ru/users/3111237/"><font color="#f5989d"><font size="1">коллаж от Sabine Astana</font></font></a></b><table style="border:3px ridge #cc9900" background="//img1.liveinternet.ru/images/attach/c/10/126/936/126936421_c42e0dfbbed9.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:15px"><table style="border:3px ridge #990000" background="//img0.liveinternet.ru/images/attach/c/10/126/936/126936420_3c274277008c.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:5px"><table width="570" height="398" style="border:0px none #000000" background="//img0.liveinternet.ru/images/attach/c/10/126/936/126936490_2571c09b69bf.gif" cellspacing="0" cellpadding="0"><tr><td style="padding:10px" zzz="zzz" align="center"><table border="0" cellspacing="0" cellpadding="0"><tr><td style="padding:1px" align="center"><table width="230" border="0" cellspacing="0" cellpadding="0"><tr><td align="center"><span style="color:#000000;font-size:20px"><b></b></span></td></tr></table></td><td style="padding:1px" align="center"><table width="305" height="360" style="border:0px none #000000" background="//img1.liveinternet.ru/images/attach/c/10/126/936/126936515_cd50c0bd81c7.png" cellspacing="0" cellpadding="0"><tr><td style="padding:10px" zzz="zzz" align="center"><span style="font-family:Verdana;color:#000000;font-size:12px"><b><marquee width="245" height="290" scrolldelay="0" direction="up" scrollamount="1" style="background: ; padding: 0px; border: 0px aeca7d;"><center><font color="#000000"><font size="2"><b><br /> Здесь будет Ваш текст</b></font></font></center></marquee></b></span></td></tr></table></td></tr></table></td></tr></table></td></tr></table></td></tr></table></center></td></tr></table>

Читать далее
еще разные уроки здесь

Разбираем код таблиц css для рамочки с картинками.
Рамки, украшенные картинкой.

С помощью CSS можно сделать вот такие лёгкие симпатичные рамки с картинкой слева, либо справа от текста.
Не буду вдаваться в подробности, как их собрать с нуля, а поясню самое необходимое. Под каждой рамкой стоит готовый код шаблона.

Ваша картинка будет располагаться слева от текста. При заполнении рамки текстом последний будет обтекать картинку. Если картинка большого размера, то и запись должна быть объёмной, иначе часть изображения выпадет за границы рамки, поскольку за разворот рамки отвечает именно текст.

Ваша подпись

<div style="background-color: #F4FC03; border:3px #00B344 ridge; width: 640px; padding-top: 15px; padding-left: 15px; padding-right: 15px; padding-bottom: 15px;"><img src="ВАША КАРТИНКА" style="float: left; margin: 0px 15px 10px 0px" /><span style="font-family: Georgia; color:#000000; font-size: 18px;">Ваша картинка будет располагаться слева от текста. При заполнении рамки текстом последний будет обтекать картинку. Если картинка большого размера, то и запись должна быть объёмной, иначе часть изображения выпадет за границы рамки, поскольку за разворот рамки отвечает именно текст.<br /><br /> <center><a href="ССЫЛКА НА ВАШ БЛОГ" target="_blank">Ваша подпись</a></center></span></div>

Смотрим дальше

Обводим текстовую рамочку изнутри.
Обводка внутри рамки (блока).

Хочу представить вам вот такую симпатичную рамку с пунктирной обводкой внутри.
Не правда ли, похоже на прошивку? Этим можно играть, подбирая тканевые цвета. Например, голубой (чем не джинс?)

Текст
Ваша подпись

<center><div style="padding: 10px 10px; background: #FE9980; width: 610px; font-size: 27px; font-family: Monotype Corsiva; color: #fff; border: 2px dashed #fff; border-radius: 3px; box-shadow: 0 0 0 5px #FE9980, 3px 2px 7px 4px rgba(10,10,0,.5); text-shadow: -1px -1px #aa3030;">Текст<br /> <center><a href="ССЫЛКА НА ВАШ БЛОГ" target="_blank"><font face="Georgia" color="#ffffff" style="font-size:18px">Ваша подпись</font></a></center></div></center>

Смотрим дальше

Детали создания сложной рамки от Юлии Гурбер.
Фоновое изображение в рамке. Часть 1

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

Здесь будет ваш текст

Ваша подпись

<center><div style="border:2px solid #EBE3D4; width:650px; padding:18px; background-image: url('https://img-fotki.yandex.ru/get/6846/163781271.c8/0_dce0f_53e73c4b_XXS.jpg'); box-shadow:rgba(0,0,0,.8) 0 5px 11px -5px;"><div style="border:2px solid #EBE3D4; padding:18px; background:#E2D6C1; border-radius:32px; box-shadow:inset 0 0 20px #000000; box-shadow:inset 0 0 20px #000000; box-shadow:inset 0 0 20px #000000; font-family:Georgia; font-size:19px; font-style:italic; color:#663300;">Здесь будет ваш текст<br /> <br /> <center><center><a data-cke-saved-href="ССЫЛКА НА ВАШ БЛОГ" href="ССЫЛКА НА ВАШ БЛОГ" target="_blank"><span style="font-size: 0.9em">Ваша подпись</span></a></center></center></div></div></center>

Объяснительная часть

Делаем красивую текстовую рамку в один слой.
Рамка в ОДИН слой.

Это простая,но оригинальная рамка состоит всего из одного слоя. Нужно только подобрать необычный фон для неё. Делаем рамку,на свой вкус, так: Если через Я.ру. Заходим и выбираем картинку-фон. НАШЛИ—НАЖАЛИ на неё. Дальше внизу В ДРУГОМ РАЗМЕРЕ -выбрали нужный размер картинки. Потом эти размеры поменяете в КОДЕ РАМКИ на свои. ..."WIDTH: 600px;ШИРИНА картинки HEIGHT: 300px"ВЫСОТА... Затем находим надпись— Код для вставки на сайт или в блог. нажали и скопировали где написано— Ссылка на фотографию. В коде "СКЕЛЕТИКА" где написано КАРТИНКА— ФОН. Внутрь кавычек.Кавычки не трогаем. Вставляете эту ССЫЛКУ. ЗДЕСЬ далее... SvetlanaT

 

КОД"СКЕЛЕТИКА"рамки.

<left><table style="WIDTH: 600px; HEIGHT: 300px" cellspacing="18" cellpadding="3" width="600" align="left" border="3" background="КАРТИНКА ФОН"><tbody><tr><td> <font size="4" color="#000000" face="Monotype Corsiva"><b><p align="center"><br /><br />ВАШ ТЕКСТ </p></b><br /> <center><a target="_blank" data-cke-saved-href="ССЫЛКА НА ВАШ ДНЕВНИК" href="ССЫЛКА НА ВАШ ДНЕВНИК"><font size="1"><b><font color="#cdbe70">ВАШ НИК</font></b></font></a></center></font></td></tr><br /></tbody></table><center></center></left>

Уроки Юлии Гурбер. Ассиметричная рамочка с помощью таблиц css.
Рамочки с закруглёнными углами

Хотите за 5 минут собрать простенькую, но очень симпатичную рамку
для текста? Например, такую:

Здесь будет ваш текст
-------

Или такую:

Здесь будет ваш текст
-------

Тогда смотрим и берём на заметку.
Смотрим дальше

Объёмные текстовые рамочки с цветной тенью.
Рамки оригинальные.

РАМКИ ОРИГИНАЛЬНЫЕ С ПОМОЩЬЮ CSS. УРОК ЮЛИИ ГУРБЕР

Такие вот оригинальные рамки (блоки) увидела на одном сайте.

Здесь будет ваш текст

Ваша подпись

<center><div style="background: #8FD532; width: 590px; padding:14px; border-radius: 18px; box-shadow: inset 5px 6px 3px rgba(203,255,144,0.4), 3px 3px 4px rgba(0,0,0,0.6), -2px -2px 4px rgba(223,152,0,0.7), 0 0 20px 3px Yellow; font-family: Georgia; font-size: 21px; font-style: italic; color:#006600;">Здесь будет ваш текст<br /> <br /> <center><a data-cke-saved-href="ССЫЛКА НА ВАШ БЛОГ" href="ССЫЛКА НА ВАШ БЛОГ" target="_blank"><span style="font-size: 0.9em">Ваша подпись</span></a></center></div></center>

Смотрим дальше

Уроки Татьяны Егоровой. Объёмные текстовые рамочки разные.
Объемные рамки разной конфигурации. Без фотошопа!

Недавно я давала урок по изготовлению рамок с круглыми углами. Посмотреть его можно здесь. А Sergg62, подсказал как сделать рамки с разными углами и тенью. За это ему огромное спасибо!
Эффект круглых углов виден в браузерах Google Chrome, Mozilla Firefox. В Internet Explorer рамка будет отражаться как обычная с прямыми углами. В других не знаю.

Читать далее

Вот такая необычная рамочка получилась у меня после комбинирования разных по конфигурации рамок и добавления нового фона. Егорова Татьяна

Код готовой рамки <table style=" width:10px;-webkit-border-radius: 20px 20px 20px 20px;-moz-border-radius: 20px 20px 20px;border-radius: 20px 20px 20px 20px;-webkit-box-shadow: #000000 6px 6px 6px;-moz-box-shadow: #000000 6px 6px 6px; box-shadow: #000000 6px 6px 6px;" background="http://content.foto.my.mail.ru/mail/tiotia-tania/14266/i-16088.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:5px"><table width="600" style="width:630px;-webkit-border-radius: 20px 20px 20px 20px;-moz-border-radius: 20px 20px 20px;border-radius: 20px 20px 20px 20px;" background="//img0.liveinternet.ru/images/attach/c/10/110/555/110555002_m3.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:20px" zzz="zzz" align="center"><span style="font-family:Verdana;color:#fff799;font-size:20px"><a target="_blank" href="http://urls.by/1uzy"><img src="http://urls.by/1uzx" border="0" /></a><table style=" width:630px;-webkit-border-radius: 2px 180px 2px 180px;-moz-border-radius: 2px 180px 2px 180px;border-radius: 2px 180px 2px 180px;-webkit-box-shadow: #000000 44px 44px 44px;-moz-box-shadow: #000000 14px 14px 14px; box-shadow: #000000 2px 4px 6px;" background="http://content.foto.my.mail.ru/mail/tiotia-tania/14266/i-16088.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:4px"><table style=" width:630px;-webkit-border-radius: 2px 180px 2px 180px;-moz-border-radius: 2px 180px 2px 180px;border-radius: 2px 180px 2px 180px;" background="http://content.foto.my.mail.ru/mail/tiotia-tania/14266/i-16063.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:5px"><table style=" width:630px;-webkit-border-radius:2px 180px 2px 180px;-moz-border-radius: 2px 180px 2px 180px;border-radius: 2px 180px 2px 180px;" background="http://content.foto.my.mail.ru/mail/tiotia-tania/14266/i-16088.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:4px"><table width="600" style=" width:630px;-webkit-border-radius:2px 180px 2px 180px;-moz-border-radius: 2px 180px 2px 180px;border-radius: 2px 180px 2px 180px;" background="http://content.foto.my.mail.ru/mail/tiotia-tania/14266/h-18805.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:20px" zzz="zzz" align="center"><span style="font-family:Verdana;color:#fff799;font-size:20px"><b><table style=" width:600px;-webkit-border-radius: 180px 2px 180px 2px;-moz-border-radius: 180px 2px 180px 2px;border-radius: 180px 2px 180px 2px;-webkit-box-shadow: #000000 4px 4px 4px;-moz-box-shadow: #000000 4px 4px 6px; box-shadow: #000000 2px 4px 6px;" background="http://content.foto.my.mail.ru/mail/tiotia-tania/14266/i-16088.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:5px"><table style="width:600px;-webkit-border-radius: 180px 2px 180px 2px;-moz-border-radius: 80px 80px 2px 2px;border-radius: 180px 2px 180px 2px;" background="//img0.liveinternet.ru/images/attach/c/10/110/555/110555002_m3.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:2px" zzz="zzz" align="center"><span style="font-family:Verdana;color:#fff799;font-size:20px"><table width="450" border="0" cellspacing="0" cellpadding="0"><tr><td align="center"><span style="font-family:Verdana;color:#fff799;font-size:20px"><b><br />Здесь будет Ваш текст<br /> <br /></b></span></td></tr></table></span></td></tr><tr><td style="padding:0px" height="1%" align="center"><span style="font-family:Verdana;color:#000000;font-size:10px"><b><a href="http://www.egorovatatiana.ru/" target="_blank">Егорова Татьяна</a><a target="_blank" href="http://www.egorovatatiana.ru/"></a></b></span></td></tr></table></td></tr></table></b></span></td></tr><tr><td style="padding:0px" height="1%" align="center"><span style="font-family:Verdana;color:#000000;font-size:10px"></span></td></tr></table></td></tr></table></td></tr></table></td></tr></table></span></td></tr><tr><td style="padding:0px" height="1%" align="center"><span style="font-family:Verdana;color:#000000;font-size:10px"><b><a href="http://www.egorovatatiana.ru/" target="_blank"></a><a target="_blank" href="http://urls.by/1uzy"></a></b></span></td></tr></table></td></tr></table>

Код "скелетика" рамки <table style=" width:10px;-webkit-border-radius: 20px 20px 20px 20px;-moz-border-radius: 20px 20px 20px;border-radius: 20px 20px 20px 20px;-webkit-box-shadow: #000000 6px 6px 6px;-moz-box-shadow: #000000 6px 6px 6px; box-shadow: #000000 6px 6px 6px;" background="ОБВОДКА" cellspacing="0" cellpadding="0"><tr><td style="padding:5px"><table width="600" style="width:630px;-webkit-border-radius: 20px 20px 20px 20px;-moz-border-radius: 20px 20px 20px;border-radius: 20px 20px 20px 20px;" background="ФОН 2" cellspacing="0" cellpadding="0"><tr><td style="padding:20px" zzz="zzz" align="center"><span style="font-family:Verdana;color:#fff799;font-size:20px"><a target="_blank" href="http://urls.by/1uzy"></a><table style=" width:630px;-webkit-border-radius: 2px 180px 2px 180px;-moz-border-radius: 2px 180px 2px 180px;border-radius: 2px 180px 2px 180px;-webkit-box-shadow: #000000 44px 44px 44px;-moz-box-shadow: #000000 14px 14px 14px; box-shadow: #000000 2px 4px 6px;" background="ОБВОДКА" cellspacing="0" cellpadding="0"><tr><td style="padding:4px"><table style=" width:630px;-webkit-border-radius: 2px 180px 2px 180px;-moz-border-radius: 2px 180px 2px 180px;border-radius: 2px 180px 2px 180px;" background="ФОН 3" cellspacing="0" cellpadding="0"><tr><td style="padding:5px"><table style=" width:630px;-webkit-border-radius:2px 180px 2px 180px;-moz-border-radius: 2px 180px 2px 180px;border-radius: 2px 180px 2px 180px;" background="ОБВОДКА" cellspacing="0" cellpadding="0"><tr><td style="padding:4px"><table width="600" style=" width:630px;-webkit-border-radius:2px 180px 2px 180px;-moz-border-radius: 2px 180px 2px 180px;border-radius: 2px 180px 2px 180px;" background="ФОН 1" cellspacing="0" cellpadding="0"><tr><td style="padding:20px" zzz="zzz" align="center"><span style="font-family:Verdana;color:#fff799;font-size:20px"><b><table style=" width:600px;-webkit-border-radius: 180px 2px 180px 2px;-moz-border-radius: 180px 2px 180px 2px;border-radius: 180px 2px 180px 2px;-webkit-box-shadow: #000000 4px 4px 4px;-moz-box-shadow: #000000 4px 4px 6px; box-shadow: #000000 2px 4px 6px;" background="ОБВОДКА" cellspacing="0" cellpadding="0"><tr><td style="padding:5px"><table style="width:600px;-webkit-border-radius: 180px 2px 180px 2px;-moz-border-radius: 80px 80px 2px 2px;border-radius: 180px 2px 180px 2px;" background="ФОН 2" cellspacing="0" cellpadding="0"><tr><td style="padding:2px" zzz="zzz" align="center"><span style="font-family:Verdana;color:#fff799;font-size:20px"><table width="450" border="0" cellspacing="0" cellpadding="0"><tr><td align="center"><span style="font-family:Verdana;color:#ЦВЕТ ШРИФТА;font-size:РАЗМЕР ШРИФТАpx"><b><br />Здесь будет Ваш текст<br /></b></span></td></tr></table></span></td></tr><tr><td style="padding:0px" height="1%" align="center"><span style="font-family:Verdana;color:#000000;font-size:10px"><b><a href="АДРЕС ВАШЕГО БЛОГА" target="_blank">ВАША ПОДПИСЬ</a><a target="_blank" href="http://www.egorovatatiana.ru/"></a></b></span></td></tr></table></td></tr></table></b></span></td></tr><tr><td style="padding:0px" height="1%" align="center"><span style="font-family:Verdana;color:#000000;font-size:10px"></span></td></tr></table></td></tr></table></td></tr></table></td></tr></table></span></td></tr><tr><td style="padding:0px" height="1%" align="center"><span style="font-family:Verdana;color:#000000;font-size:10px"><b><a href="http://www.egorovatatiana.ru/" target="_blank"></a><a target="_blank" href="http://urls.by/1uzy"></a></b></span></td></tr></table></td></tr></table>

Делаем рамочки с круглыми углами без фотошопа. Уроки Татьяны Егоровой.
Рамка с круглыми углами. Без фотошопа!

РАМКИ С КРУГЛЫМИ УГЛАМИ

А здесь урок по таким же рамкам, но объемным (с тенями и разными углами)


Наверно многие, кто сейчас смотрит на рамку ниже, думают, что она сделана в программе Фотошоп...Нет. Она сделана с помощью html-кода, как обычные рамки с прямыми углами. Эффект круглых углов виден в браузерах Google Chrome, Mozilla Firefox. В Internet Explorer рамка будет отражаться как обычная с прямыми углами. В других не знаю. Я дам "скелетик" кода такой рамки, чтобы подставляя свои фоны и параметры, вы могли без особого труда собрать свою рамочку и объясню как им пользоваться.

Читать далее

Вот такая рамочка получилась у меня после добавления картинок. Думаю их код можно усовершенствовать, а варианты рамок разнообразить. Испытала только на Лиру. Для Яру и других сайтов нужен другой код. Может кто-то сделает. Была бы рада посмотреть на ваши рамки, которые вы сделаете по этому уроку. Удачи! Егорова Татьяна

Код готовой рамки <table style="border:0px none #000000" background="http://content.foto.my.mail.ru/mail/tiotia-tania/14266/i-16088.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:4px"><table style="border:0px none #000000" background="http://content.foto.my.mail.ru/mail/tiotia-tania/14266/i-16063.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:5px"><table style="border:0px none #000000" background="http://content.foto.my.mail.ru/mail/tiotia-tania/14266/i-16088.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:4px"><table width="600" style="border:0px none #000000" background="//img0.liveinternet.ru/images/attach/c/10/110/555/110555002_m3.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:8px" zzz="zzz" align="center"><table border="0" cellspacing="0" cellpadding="0"><tr><td style="padding:4px" align="center"><table border="0" cellspacing="0" cellpadding="0"><tr><td align="center"><span style="font-family:Verdana;color:#fff799;font-size:20px"><b><table style=" solid silver; border-radius:80px;" background="http://content.foto.my.mail.ru/mail/tiotia-tania/14266/i-16088.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:4px"><table style=" solid silver; border-radius:80px;" background="http://content.foto.my.mail.ru/mail/tiotia-tania/14266/i-16063.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:5px"><table style=" solid silver; border-radius:80px;" background="http://content.foto.my.mail.ru/mail/tiotia-tania/14266/i-16088.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:4px"><table width="600" style=" solid silver; border-radius:80px;" background="//img0.liveinternet.ru/images/attach/c/10/110/555/110555002_m3.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:20px" zzz="zzz" align="center"><span style="font-family:Verdana;color:#fff799;font-size:20px"><b><a href="http://www.egorovatatiana.ru/" target="_blank"><img src="//img1.liveinternet.ru/images/attach/c/10/110/565/110565999_110557408_87648966_element55_ks.png" width="310" height="95" border="0" /></a><br /> Здесь будет Ваш текст<br /><br /><a href="http://www.egorovatatiana.ru/" target="_blank"><img src="//img1.liveinternet.ru/images/attach/c/10/110/565/110565999_110557408_87648966_element55_ks.png" width="310" height="95" border="0" /></a></b></span></td></tr><tr><td style="padding:0px" height="1%" align="center"><span style="font-family:Verdana;color:#000000;font-size:10px"><a href="http://www.egorovatatiana.ru/" target="_blank"></a> </span></td></tr></table></td></tr></table></td></tr></table></td></tr></table> </b></span></td></tr></table></td></tr><tr><td style="padding:4px" align="center"><table width="600" height="240" style="border:0px none #000000" background="//img1.liveinternet.ru/images/attach/c/10/110/557/110557223_82296535_0_49cdf_d7b1032f_M.png" cellspacing="0" cellpadding="0"><tr><td style="padding:20px" zzz="zzz" align="center"><span style="color:#000000;font-size:20px"></span></td></tr></table></td></tr></table></td></tr><tr><td style="padding:0px" height="1%" align="center"><span style="font-family:Verdana;color:#000000;font-size:10px"><a href="http://www.egorovatatiana.ru/" target="_blank">Егорова Татьяна</a> </span></td></tr></table></td></tr></table></td></tr></table></td></tr></table>

Создаём кнопки в посте. Коды кнопок. Прокрутка текста.

Формулы и коды.

 

Текстовые рамочки с объёмным фоном от Татьяны Егоровой
Рамки с объемным фоном без фотошопа!

РАМКИ С ОБЪЕМНЫМ ФОНОМ

Не так давно здесь и здесь я давала уроки как делать без фотошопа рамки с круглыми углами и тенью. Сегодня даю небольшое дополнение к предыдущим урокам. Расскажу как сделать объемно-выпуклым центральный фон и вообще любой фон в рамке. Сравните. Рамка А без эффекта объема, рамка Б с таким эффектом и рамка В с усиленным эффектом.

РАМКА А

Здесь будет Ваш текст Егорова Татьяна

РАМКА Б

Здесь будет Ваш текст Егорова Татьяна

РАМКА В

Здесь будет Ваш текст Егорова Татьяна

Можно сделать рамку и с прямыми углами

Здесь будет Ваш текст Егорова Татьяна

Эффект круглых углов виден в браузерах Google Chrome, Mozilla Firefox. В Internet Explorer рамка будет отражаться как обычная с прямыми углами. В других не знаю. Я дам "скелетик" кода такой рамки, чтобы подставляя свои фоны и параметры, вы могли без особого труда собрать свою рамочку и объясню как им пользоваться.

Читать далее...

Плееры HTML5.
HTML5 для ЛиРу - коды плееров.

Прокрутка текста в рамочке.
Разная прокрутка для текста.



ПАМЯТКА НАЧИНАЮЩИМ БЛОГГЕРАМ.

ПРОКРУТКА ТЕКСТА


<div align="center"><select multiple="multiple" size="10">ТЕКСТ...</select></div>

Каждую строчку надо заключать в теги <option>строчка</option>

ПРИМЕР:

Один день из жизни Ангела Бывают такие, которым везет с подопечными. Но я не из их числа. Мне досталась упрямая своенравная девица, отличающаяся, однако, живым умом и недурственной внешностью. Сейчас она спит, а я могу немножко поболтать. Через полчаса она сделает попытку продрать глаза. Но я уже знаю, что ей это не удастся. На работу мы опоздаем. Забыл представиться. Я – ангел. Да, тот самый, который стоит за правым плечом и подсказывает вам на какой остановке выйти, когда через замерзшие окна не видно даже день сейчас или ночь, и по каким улицам пройти поздно вечером, чтобы избежать встречи с темными личностями. Видимо, я чем-то провинился, но совершенно этого не помню, почему еще мне не достался какой-нибудь симпатичный очкарик, проводящий жизнь за учебниками или какая-нибудь девочка-ромашка, за которой и следить-то ничего не стоит, а уж устроить жизнь – и вовсе дело пяти минут . Нет, моя не такая. Сколько раз я уже думал: ну вот наконец-то! Но нет, она рушила все мои надежды. Вот, видите, видите? Начал звонить будильник. Ага, потянулась. Сейчас пойдет в душ. Она всегда не в духе по утрам. Я к этому давно привык и не вмешиваюсь. А теперь мы уже поели, намарафетились и поехали. Причем в общественном транспорте. Говорил я ей: ну купи ты машину! А она даже права не удосужилась получить. Ну ладно бы хоть с пользой ехала, ну улыбнись ты хоть кому-нибудь! Вишь, вон какой стоит, на тебя уже минут двадцать смотрит, а ты чего? Ну хватит зевать в его сторону, дырку прозеваешь! Конечно, теперь мы еще и книжку достали. Ладно, книжка – это еще полбеды, но хоть бы на русском! Хорошо, пусть даже на китайском, но не теория поля же! Мущщина!!! Она нормальная!!! Она прикиды... Эх, мужчина... Ну вот, теперь точно все. Мы его потеряли. Уж лучше бы зевала. На работу мы опоздали. Зато охраннику почему-то улыбаемся. Явно где-то кидают. Все ясно, мы забыли пропуск. Ну дальше все понятно. 8 часов с перерывом на обед – 260 дней в году. А еще сегодня у нас особое развлечение. Называется мазох... тьфу, спортзал. Беги, Лола, беги! Бегом от инфаркта прямо к светлому будущему. Лучше бы курить уже бросила наконец. Эх ты... ладно, мне не привыкать. Идем. Нет, ползем. В меру сил помогаю тащить сумку с кроссовками. Ой, кто здесь? А-а-а-а... товарищ по цеху... как не пойдешь? Ну прогуляйся ты с ним остановочку, видишь как просит! Ну плевать что минус тридцать – почти Ташкент! Ну и что, что устала... ладно-ладно, я не особо-то и надеялся. Ну чего пригорюнилась? Скучно? Ах, одино-о-о-око... Да, дорогая, здесь вам не тут. Прынцы все повымирали в процессе эволюции. Где-то в одно время с мамонтами. Думаешь, один завалялся? И прямо специально для тебя и на белом велосипеде? Ну что ж, будем искать. Как не помогаю? Кто не помогаю? Я не помогаю? А помнишь, сколько раз я тебе на экзаменах легкие билеты подсовывал? А помнишь как мы на мосту видели аварию автобуса с твоим номером? Как ты думаешь, а что бы было если бы мы тогда на гололеде не упали, а? А когда нас в Москву понесло и мы чуть на поезд не опоздали, кто надоумил время спросить, а? А помнишь как мы... ладно-ладно молчу... давай уже ужинать. Что там у тебя? бейлис? со льдом? Ну разливай давай. Давай, что ли, за прынцев... Эх, нелегкая у нас, у ангелов, работа...

Давайте напишем стихотворение в прокрутке

В этом мире всё не так случайно,Есть во всём таинственная суть.Рвался на порог ты мой отчаянно,Я тебя старалась отпихнуть.Ты рычал , мычал и кукарекал.(Разум твой окутывала мгла).Не был ты похож на человека,Да и я признаться не была.Может быть в объятьях незнакомкиТы хотел забыться и уснуть,Может отыскать себе от ломкиВ шкафчике аптечном что–нибудь ?В этом мире всё не так случайно,Мы на том стояли и стоим.
Рвался на порог ты мой отчаянно Спьяну перепутав со своим !

Каждую строчку стихотворения тоже надо заключать в теги <option>строчка</option>

Размеры size="10" - соответствует количеству строк в высоту. Если изменим размер на 2, получим следующую прокрутку:

Я помню чудное мгновеньеПередо мной явилась ты
Как мимолетное видение
Как гений чистой красоты

Есть еще одна формула, для другой прокрутки:

<textarea style="text-align: center;" readonly="readonly" cols="45" rows="10">ВАШ ТЕКСТ!</textarea>

В этой формуле не надо ставить теги option, текст надо писать подряд, без обзацев.

ПРИМЕР:

Дело происходило в маршрутке, бороздящей просторы одного из спальных районов нашей столицы. Водители этой «капсулы смерти» придумали себе очень забавное развлечение, которое по достоинству оценили все пассажиры. Суть в следующем:"…стою на остановке, как всегда, жду эту Газель. Подъезжает. Ну так как я первый, следовательно лезу в перед. Получилось так, что после меня в эту маршрутку ,в ближайшие 2-3 минуты, никто не залезал. Ну, я сел, дал водиле 15 рублей за проезд и тупо уставился в окно. Он молча взял деньги, завел двигатель, вышел из машины, обошел ее и открыл мою дверь, сказал «подвинься» и уселся рядом со мной. Мой вопросительный вид он проигнорировал, лишь улыбнулся. Мне стало несколько не по себе. В это время с прибывшей электрички повалил ,уставший после трудового дня, народ. Ну, кто куда, разумеется, маршрутка начала стремительно заполняться. Я опять вопросительно посмоторел на водилу. Ноль внимания. Тем временем Газель окончательно заполнилась. Народ уже передает деньги за проезд, а водила, как сидел так и сидит. Так продолжается минут 5. Слышится реплика следующего характера: «Ну и где этот мудак?!?!!», к инициативному человеку средних лет, который и стал автором выше указанной фразы, незамедлительно стал подключатся недовольный долгим отсутствием водителя народ. «И в правду сколько его можно ждать, у меня дома собака голодная…». Все обитатели транспортного средства погрузились в обсуждение недостатков горе-водителя. Выбрав паузу между недовольством пассажиром, водила поворачивается к основной массе народа и с диким лицом, громко говорит «Бля, какого ... мы ждем этого ..., я и сам прекрасно знаю дорогу!». Шустро открывает дверь, бежит к водительской, садится за руль и с буксой рвет с места. В маршрутке воцарилось зловещее молчание. А я к тому моменту понял умысел водилы, сижу и с нетерпением жду реакции пассажиров. Минут через 5 какой-то молодой человек сказал « Мужик тормози, поймают посадят, накрутят по полной программе!!!» Ответ: « Да мне пофиг, я в следующем доме живу, сейчас вылезу и хер меня кто найдет!!!».Опять молчание. Я сижу и с огромным трудом сдерживаю распирающий меня смех. Водила понял, что настал критический момент и сказал: « Ладно, я и есть водитель, а это все шутка была, за проезд передаем». Неудивительно, что кроме меня никто не засмеялся. Большая часть народа доехала до конечной остановки, причем молча, видно от легкого шока позабывали, где им нужно было попросить остановиться."

для вас Лариса Гурьянова

Создаём текстовую рамочку с разрывом.
Рамочка с разрывом.

РАМОЧКА С РАЗРЫВОМ

Как то уже давненько не встречала рамок, в которых есть рамочка с разрывом. Но тут мне о них напомнила falconet-n. Благодаря ей и появился этот урок. На фоне показаны несколько примеров таких рамок.

Простая рамочка Выпуклая рамочка Рамочка с круглыми углами Рамочка с тенью Рамочка с заданной шириной

урок провела Егорова Таня

Читать далее

Полезные редакторы из инета. Он-лайн графические редакторы

 

---

 Все представленные сервисы бесплатные.

 

Читать далее...

Создание рамочек при помощи генератора онлайн. Мои помощники генераторы для создания рамочек..Делюсь.
 

Этот генератор создаёт округлость рамочек, тень для них и тень для текста. Генератор на английском языке, но всё в нём понятно. Кстати, генераторы для тех, кто разбирается в кодах HTML. Ниже я объясню основные шаги. Для начала познакомимся с ним.. Заходим, но это для тех, кто понимает английский))).. И конечно , я объясню Вам подробно о разделах по отдельности, код, которых принимает наше Li.ru. Внешняя тень для рамочек.. Движками вы можете регулировать тень, которая будет за рамочкой и нажав на палитру, вы выбираете цвет этой тени.. когда вы будете довольны тем, что создали -слева копируете код вашей тени и вставляете в общий код рамочки. Сверху три палитры для примера, как будет цвет вашей рамочки и цвет тени выглядеть на общем фоне.Но в коде этой палитры уже не будет. Ну.... жмите на картинку и переходите к генератору.

Как изменить вес изображения и гифок?
Уменьшаем ВЕС изображения

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


1.


2.


3.


Читать далее