Урок от Beauti_Flash, как пользоваться рамочками. |
|
|
Моя рамочка |
|
|
|
Код общей рамки внутри которой будет еще 3 (Текст1,Текст2,Текст 3)
padding: 12px 12px; — расстояние от края рамки (бордюра) до текста.
При необходимости меняем "12" на другую цифру.
background: #EFDBB8; — фон для записи. Можно вместо #FE9980 подставить другой цвет. width: 720px; — ширина рамки. Вместо "720" указываем своё значение. font-size: 20px; — размер шрифта. font-family: PT Serif; — вид шрифта. Можно поменять на Monotype Corsiva, Georgia. color: #8B795E; — цвет шрифта. border: 2px dashed #8B795E; — это пунктирная обводка. Можно вместо "2" указать другой размер, а вместо "8B795E" подставить другой цвет. border-radius: 15px; — скругление углов в рамке. box-shadow: 0 0 0 5px #EFDBB8, 3px 2px 7px 4px rgba(10,10,0,.5); — Внимание! В этой строке меняем обязательно только цвет #EFDBB8. Он должен быть идентичен с фоном для записи. Это будет продолжением нашего фона над пунктирной обводкой. text-shadow: 1px 1px 1px #000000; — возвращаемся к шрифту... Это его тень, то есть величина "1" и цвет тени "#000000".
|
||||||
Серия сообщений "***РАМКИ для текста":
Часть 1 - Рамочки для постов от "Arnusha"
Часть 2 - Однотонные рамочки для записей
...
Часть 21 - Рамочки для записей от "Arnusha"
Часть 22 - Рамочки для записей от "Arnusha"
Часть 23 - Моя рамочка
Часть 24 - Рамочки простые от "woman_by"
Часть 25 - Рамочки "Ribbon"
...
Часть 39 - Простые рамочки для текста (альбомные и обводка, тетрадный лист)
Часть 40 - Прозрачные рамочки с золотой обводкой 0006
Часть 41 - Прозрачные разрезные рамочки
|
Рамочка для записей. |
Дневник |
|
|
Изучаю тени... |
Серия сообщений "*** уроки":
Часть 1 - комментики на скорую руку
Часть 2 - Делаем простую Рамку с двигающимся текстом.
...
Часть 15 - Делаем круглые картинки без ФШ
Часть 16 - Внутренние тени изображений и текста
Часть 17 - Изучаю тени...
Часть 18 - Как сделать тени в рамочке и на картинках
Часть 19 - мастерская ZOMKI -рамочка
...
Часть 34 - ВАРИАНТЫ РАМОЧЕК
Часть 35 - ХРОНИКА вставки РАМКИ через "ИСТОЧНИК" РАСШИРЕННОГО РЕДАКТОРА ЛИру
Часть 36 - РАСШИРЕННЫЙ РЕДАКТОР ЛИру
|
набор альбомных рамочек |
|
рамочка |
**********тут ваш текст*********** тут только высоту прокрутки менять надо  а так то я всегда пользуюсь Генератором промотки для текста это удобнее. вставил туда готовый текст или картинки, а потом скопировала во втором окошечке - и вставляй в свою рамочку.... оптимальный размер картинки по ширине 570рх |
|
Фоновое изображение в рамке. |
|
ФОРМУЛА РАМКИ |
|
Рамочка по формуле |
|
|
рамочки голубые + формула |
|
|
рамочки простые фон прозрачный с прокруткой +формула |
|
|
Рамочки простые для заметок +формула |
|
|
Рамочки - линии для выделения текста |
  В рамочку можно вставлять все, что вам захочется, то есть весь ваш пост. Коды каждой такой рамочки внутри конкретной рамки. Копируйте их, и ставьте в свои записи в Простом редакторе.. Там где написано ВАШ ТЕКСТ- Вставляете свой текст.  |
Серия сообщений "Шпаргалки":
Часть 1 - Как сделать бегущую строку и бегущее изображение в дневнике
Часть 2 - Несколько оригинальных формул и ссылок для дневника
Часть 3 - Рамочки - линии для выделения текста
Часть 4 - БРОДИЛКА ПО САЙТАМ одноразовая e-mail электронная почта
Часть 5 - Разлиновка — шаблоны разлинованных листов всех форматов.
...
Часть 11 - Все о бегущем тексте. Примеры и коды.
Часть 12 - Все о ссылках, оформление и коды.
Часть 13 - РАБОТА С ТЕКСТОМ. html коды для текста
|
ФОРМУЛЫ от мадам Ольги |
|
|
ФОРМУЛЫ от мадам Ольги |
|
|
ФОРМУЛЫ от мадам Ольги |
|
|
ФОРМУЛЫ от мадам Ольги |
|
|
|
ФОРМУЛЫ от мадам Ольги |
|
|
Без заголовка |
|
|
рамочка (+формула) |
рамочка ситцевая (+формула)
|
|
рамочки +формула |
|
Простые, оригинальные рамочки разного цвета |
Простые, оригинальные рамочки разного цвета
 Простые и оригинальные рамочки, которыми можно разнообразить свои посты. Смотрятся они красиво, и очень просты в использовании. Рамочки не мои, собраны на просторах инета, пользуюсь ими давно , авторов не знаю, но очень им благодарна за работу. 
Копируйте их, и ставьте в свои записи в Простом редакторе. Цвет ободков рамки так же можно менять. Таблица кода цветов НАХОДИТСЯ ЗДЕСЬ. Аккуратно стираете в коде рамки КОД ЦВЕТА, и меняете на свой. Для новичков поясню. Код цвета надо БРАТЬ ИЗ САМОЙ ПОСЛЕДНЕЙ КОЛОНКИ в таблице. Там где написано ВАШ ПОСТ- Вставляете свой текст. |
Серия сообщений "Шпаргалки":
Часть 1 - Как сделать бегущую строку и бегущее изображение в дневнике
Часть 2 - Несколько оригинальных формул и ссылок для дневника
...
Часть 9 - Он-лайн конвертер с большим выбором форматов
Часть 10 - Бродилка по сайтам для обработки фото
Часть 11 - Простые, оригинальные рамочки разного цвета
|
Еще вариант рамочки |
Еще вариант рамочки...
СКЕЛЕТИК РАМОЧКИ
Серия сообщений "ДЕЛАЕМ РАМКУ":
Часть 1 - Рамки оригинальные
Часть 2 - Стильные рамки (блоки)
...
Часть 10 - Плавающая рамочка...
Часть 11 - ridge-кромка,inset-выдавленная,outset-выпуклая,groove-с выемкой,double-двойная кромка
Часть 12 - Еще вариант рамочки...
Часть 13 - Формула объемной рамочки
Часть 14 - Просто обводка
...
Часть 17 - Рамочка со скрытой прокруткой
Часть 18 - рамочки бирюзовые (+формула)
Часть 19 - Простые ОБЪЕМНЫЕ рамочки разной формы
Серия сообщений "ФОРМУЛЫ РАМОК":
Часть 1 - Красивый текст для блога
Часть 2 - Рамки оригинальные
...
Часть 13 - ridge-кромка,inset-выдавленная,outset-выпуклая,groove-с выемкой,double-двойная кромка
Часть 14 - Формула моей рамочки+скелетик...
Часть 15 - Еще вариант рамочки...
Часть 16 - формула
Часть 17 - Формула объемной рамочки
...
Часть 22 - Рамочка со скрытой прокруткой
Часть 23 - рамочки бирюзовые (+формула)
Часть 24 - код простой рамочки-обводки
|
Формула объемной рамочки |
Формула объемной рамочки
|
***СКЕЛЕТИК***
Серия сообщений "ДЕЛАЕМ РАМКУ":
Часть 1 - Рамки оригинальные
Часть 2 - Стильные рамки (блоки)
...
Часть 11 - ridge-кромка,inset-выдавленная,outset-выпуклая,groove-с выемкой,double-двойная кромка
Часть 12 - Еще вариант рамочки...
Часть 13 - Формула объемной рамочки
Часть 14 - Просто обводка
Часть 15 - Рамочка...
...
Часть 17 - Рамочка со скрытой прокруткой
Часть 18 - рамочки бирюзовые (+формула)
Часть 19 - Простые ОБЪЕМНЫЕ рамочки разной формы
Серия сообщений "ФОРМУЛЫ РАМОК":
Часть 1 - Красивый текст для блога
Часть 2 - Рамки оригинальные
...
Часть 15 - Еще вариант рамочки...
Часть 16 - формула
Часть 17 - Формула объемной рамочки
Часть 18 - Меняем цвет основы рамочки...и получаем новую..красива и без фонов
Часть 19 - Обводка...
...
Часть 22 - Рамочка со скрытой прокруткой
Часть 23 - рамочки бирюзовые (+формула)
Часть 24 - код простой рамочки-обводки
|
Рамочка для текста по формуле |
Рамочка для текста по формуле © $vetL@n@
Рамочка сделана по формуле © $vetL@n@ Может. кто знает, есть ли она тут На Лире?
|
Без заголовка |
Дневник |
|
|
Скелетик рамочки:
|
Простые ОБЪЕМНЫЕ рамочки разной формы |
Простые ОБЪЕМНЫЕ рамочки разной формы
 
Копируйте их, и ставьте в свои записи в Простом редакторе, меняйте фоны под свой дневник. Там где написано ВАШ ПОСТ- Вставляете свой текст. |
Серия сообщений "Шпаргалки":
Часть 1 - Как сделать бегущую строку и бегущее изображение в дневнике
Часть 2 - Несколько оригинальных формул и ссылок для дневника
...
Часть 6 - Разлиновка — шаблоны разлинованных листов всех форматов.
Часть 7 - Красивые слайд-шоу в ваш дневник
Часть 8 - Простые ОБЪЕМНЫЕ рамочки разной формы
Часть 9 - Он-лайн конвертер с большим выбором форматов
|
Обводка внутри рамки (блока) |
Обводка внутри рамки (блока)
|
Как сделать тени в рамочке и на картинках |
|
РАМКИ С КРУГЛЫМИ УГЛАМИ БЕЗ ФОТОШОПА |
РАМКИ С КРУГЛЫМИ УГЛАМИ БЕЗ ФОТОШОПА
Многие спрашивают, как сделать рамочку с круглыми углами?
ЕгороваТатьяна уже разьясняла,как это делается: тут
Немного дополню её, в своём маленьком уроке
По просьбе посетителей моего дневника продемонстрирую,в небольшом уроке, как это сделать.
Рассотрим,из чего же состоит наша формула
Это часть нашей формулы, один "контейнер" (их может быть несколько)
<div style="box-shadow:12px 8px 7px #FF533E,18px -3px 2px #2D20FF,-2px -2px 17px #00D80F;border:5px inset #3F1D00;border-radius:50px;padding:10px;background-image:url('АДРЕС ВАШЕЙ КАРТИНКИ');width:50%;"><center><br />ВАШ ТЕКСТ<br /><br />
Контейнер состоит из атрибутов:
"div style" - блочный элемент стилей
"box shadow" - эффект тени (красная, синяя, зелёная...ставить на Ваше усмотрение)
"border" - эффект бордюра : inset - цвет эффекта бордюра(чёрно серый)
"border-radius" - радиус скругления углов
Радиус скругления углов,можно задавать как 1 значением (для всех улов),
2 значениями (для 2 углов по диагонали), так и 4 углов (для каждого угла)
"padding" - внутренний отступ в элементе
"background-image" - фоновая картинка (адрес фоновой картинки)
"width" - ширина рамки (может быть выражена в % или же в px)
могут встречаться атрибуты:
"-webkit-box-shadow" - для отображения в старых версиях браузера Chrome,
"-moz-box-shadow" - для отображения в старых версиях браузера Mozilla Firefox,
"box-shadow" - для отображения во всех остальных браузерах.
|
| Страницы: | [2] 1 |
