-Рубрики

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

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

Поиск сообщений в НАТАХА_60

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

 

 -Сообщества

Участник сообществ (Всего в списке: 3) УРОКИ_ФОТОШОПА Creative_Designs Questions_LiveInternet
Читатель сообществ (Всего в списке: 4) Куклы_и_Модели АртБазар Мир_клипарта Студия_и_К

 -Статистика

Статистика LiveInternet.ru: показано количество хитов и посетителей
Создан: 23.04.2011
Записей: 1456
Комментариев: 12298
Написано: 23873


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

Суббота, 16 Августа 2014 г. 15:11 + в цитатник
Цитата сообщения Юлия_Гурбер Обводка внутри рамки (блока)

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




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

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".

Подготовила Юлия Гурбер
Рубрики:  рамочки
Метки:  
Понравилось: 2 пользователям