Записи Друзья Комментарии
соо-шпаргалка
Аватар соо-шпаргалка

 -Всегда под рукой

 -Метки

adobe flash cs6 portable. artstudio blufftitler dp animation maker free online-image-editor gimp html mozilla firefox paint viber windows movie maker youtube Маски ТВ анимация антивирус блокировка рекламы браузер бродилка видео вирус вопрос все под рукой генератор генератор анимации генератор кнопок генератор рамочек генератор слайд-шоу генератор текста генераторы цвета движение делаем кнопки делаем плеер делаем рамочки делаем схемы делаем фон закладки запись действия на компьютере иконки интернет кат клавиши кнопки компьютер конвектор лиру мозилла музыка новости обои обрезать музыку окошко для кода оформление ссылок палитра цвета папки плагины плеер подложка поздравления программы промотка текста простой редактор работа с видео работа с картинкой работа с текстом работа с флеш рабочий стол радио рамочка с разрывом рамочки рамочки фш расположение картинок расположение текста расширение реклама сайты сертификат скайп скорость интернета слайд-шоу справочник лиру стили фотошоп таблицы текст телефон уроки от veta уроки фотошоп установка фильтров фильтры флеш фоторедактор фотохостинг фотошоп хостинг часики часы чистильщик шаблоны рамочек шрифт эдитор яндекс яндекс-диск

 -Поиск по дневнику

Поиск сообщений в соо-шпаргалка

 -Подписка по e-mail

 

 -Сообщества

Участник сообществ (Всего в списке: 1) Best_of_Callery

 -Статистика

Статистика LiveInternet.ru: показано количество хитов и посетителей
Создан: 08.12.2014
Записей: 756
Комментариев: 3861
Написано: 5168


Обводка внутри рамки (блока)

Четверг, 21 Мая 2015 г. 22:13 + в цитатник
Veta-z все записи автора
Цитата сообщения Юлия_Гурбер
Прочитать целикомВ свой цитатник или сообщество!
Хочу представить вам вот такую симпатичную рамку с пунктирной обводкой внутри.
Не правда ли, похоже на прошивку? Этим можно играть, подбирая тканевые цвета. Например, голубой (чем не джинс?)




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

padding: 10px 10px; — расстояние от края рамки (бордюра) до текста. При необходимости меняем "10" на другую цифру.

background: #FE9980; — фон для записи. Можно вместо #FE9980 подставить другой цвет.

width: 610px; — ширина рамки. Вместо "610" указываем своё значение.

font-size: 27px; — размер шрифта.
font-family: Monotype Corsiva; — вид шрифта. Можно поменять Monotype Corsiva, например, на Georgia.
color: #fff; — цвет шрифта.

border: 2px dashed #fff; — это пунктирная обводка. Можно вместо "2" указать другой размер, а вместо "fff" подставить другой цвет.

border-radius: 3px; — скругление углов в рамке.

box-shadow: 0 0 0 5px #FE9980, 3px 2px 7px 4px rgba(10,10,0,.5); — Внимание! В этой строке меняем обязательно только цвет #FE9980. Он должен быть идентичен с фоном для записи. Это будет продолжением нашего фона над пунктирной обводкой.

text-shadow: -1px -1px #aa3030; — возвращаемся к шрифту... Это его тень, то есть величина "-1" и цвет тени "#aa3030".

Подготовила Юлия Гурбер

Серия сообщений "ДЕЛАЕМ РАМОЧКИ":
Часть 1 - Простые рамки-обводки для оформления дневника
Часть 2 - Рамки с объемным фоном без фотошопа!
...
Часть 22 - УРОК = КАК РАЗРЕЗАТЬ РАМОЧКУ ФОТОШОП И ВСТАВИТЬ В СООБЩЕНИЕ
Часть 23 - Рамки, украшенные картинкой
Часть 24 - Обводка внутри рамки (блока)
Часть 25 - Делаем рамку в программе Фотошоп.
Часть 26 - Еще раз о рамочках в 4 слоя-урок от VETA
...
Часть 47 - Урок делаем рамочку в фотошопе.(для новичков)
Часть 48 - Урок рамка фотошоп с картинкой. в Photoshop
Часть 49 - Рамочка украшенная клипартом в Эдиторе

Рубрики:  ДЕЛАЕМ РАМОЧКИ/-без ФШ
Метки:  
Понравилось: 1 пользователю
Нравится

Я_Галчонок   обратиться по имени Пятница, 22 Мая 2015 г. 05:28 (ссылка)
Доброе утро,Светик!Спасибо за урок!Очень нужный!Всего тебе доброго,милая!!
Ответить С цитатой В цитатник
Перейти к дневнику

Пятница, 22 Мая 2015 г. 09:00ссылка
Veta-z
Доброе утро.Галочка! Спасибо
ОтветитьС цитатойВ цитатникОбратиться по имени
Комментировать — К дневнику — Страницы: [1] [Новые]
 

Добавить комментарий:
Текст комментария: смайлики

Проверка орфографии: (найти ошибки)

Прикрепить картинку:

 Переводить URL в ссылку
 Подписаться на комментарии
 Подписать картинку


О проекте