• Авторизация


Рамочки с флагом своей страны. 02-02-2016 12:48 к комментариям - к полной версии - понравилось!

Это цитата сообщения Шадрина_Галина Оригинальное сообщение

Рамочки с флагом своей страны.

0_9349f_824aa83f_L.png
Предлагаю вам вот такие простые, но оригинальные рамочки, для постов посвященных тематике своей страны, или поздравлений с 23 февраля, Днем Победы и прочих праздников.
Код такой рамочки внутри рамки.


<div style="padding-left: 10px; padding-right: 10px;"><div style="width: auto; background-repeat: repeat; height: 100%; background-color: white; box-shadow: 0px 0px 10px black; padding: 0px 0px 0px 50px;"><div style="height: 100%; background-color:blue; padding: 0px 0px 0px 50px; box-shadow: 0px 0px 1px black;"><div style="height: 100%; background-color: red; box-shadow: 0px 0px 0px black; padding: 0px 0px 0px 50px;"><div style="height: 100%; background-color: #FFEBCD; box-shadow: 0px 0px 0px black;">
ВАШ ТЕКСТ, Картинки и прочее
</div></div></div></div></div></div>



Где цвета , и размеры полосок можно заменять на свои. ШИРИНА полосок (цветов флага) в пикселях. Можно их менять. Посмотрите на картинке.

В высоту рамка растянется сама, по вашему посту.

[700x257]

Голубым цветом выделена ширина полосок флага. В первом случае ( рамочка вверху) она у меня стояла 50px, сейчас я ее заменила на 20px Рамочка уже выглядит вот так. (код ее внутри рамки)


<div style="padding-left: 10px; padding-right: 10px;"><div style="width: auto; background-repeat: repeat; height: 100%; background-color:White; box-shadow: 0px 0px 10px black; padding: 0px 0px 0px 20px;"><div style="height: 100%; background-color:blue; padding: 0px 0px 0px 20px; box-shadow: 0px 0px 1px black;"><div style="height: 100%; background-color: red; box-shadow: 0px 0px 0px black; padding: 0px 0px 0px 20px;"><div style="height: 100%; background-color: #FFFACD; box-shadow: 0px 0px 0px black;">
ВАШ ТЕКСТ и картинки
</div></div></div></div></div></div>


Цвета полосок флага, так же можно заменять. Открываем таблицу цветов, которая находится здесь УНИКАЛЬНАЯ ТАБЛИЦА HTML цветов, находим нужные цвета и заменяем
смотрим на картинке.

[700x234]

Голубым выделены цвета полосок флага, а красным, это цвет самой рамки, где будет расположен пост.

ВНИМАНИЕ из ТАБЛИЦЫ HTML цветов, можно брать как HTML Имя Цвета (это показано в полосках цвета флага и выделено ГОЛУБЫМ), так и его код (HEX), который показан в цвете самой таблицы (и выделено на рисунке КРАСНЫМ). Работает и так и так.

Если в вашей стране флаг двух цветный, то один блок с полоской можно выбросить. Вот код таблицы с двухцветным флагом.




И еще одна рамочка с флагом. Но полоски флага располагаются не сбоку, а сверху. Код такой рамочки внутри ее.




<div style="padding-left: 10px; padding-right: 10px;"><div style="width: auto; background-repeat: repeat; height: 100%; background-color:White; box-shadow: 0px 0px 10px black; padding: 20px 0px 0px 0px;"><div style="height: 100%; background-color: blue; padding: 20px 0px 0px 0px; box-shadow: 0px 0px 1px black;"><div style="height: 100%; background-color: red; padding: 20px 0px 0px 0px; box-shadow: 0px 0px 1px black;"><div style="height: 100%; background-color:#F5DEB3; box-shadow: 0px 0px 0px black;">
ВАШ ПОСТ
</div></div></div></div></div></div>


Ширину полосок, их количество и цвета менять аналогично. Как и цвет самой рамки, где будет располагаться ваш пост.

Рамка, где ширина полосок увеличена до 50px . Код тоже внутри рамки.


<div style="padding-left: 10px; padding-right: 10px;"><div style="width: auto; background-repeat: repeat; height: 100%; background-color:White; box-shadow: 0px 0px 10px black; padding: 50px 0px 0px 0px;"><div style="height: 100%; background-color: blue; padding: 50px 0px 0px 0px; box-shadow: 0px 0px 1px black;"><div style="height: 100%; background-color: red; padding: 50px 0px 0px 0px; box-shadow: 0px 0px 1px black;"><div style="height: 100%; background-color:#B0E0E6; box-shadow: 0px 0px 0px black;">
ВАШ ПОСТ
</div></div></div></div></div></div>

0_9349f_824aa83f_L.png



Серия сообщений "Шпаргалки":

Часть 1 - Как сделать бегущую строку и бегущее изображение в дневнике
Часть 2 - Несколько оригинальных формул и ссылок для дневника
...
Часть 18 - 100 самых полезных сайтов Интернета
Часть 19 - Как правильно вставлять код в окошко для кодов.
Часть 20 - Рамочки с флагом своей страны.


вверх^ к полной версии понравилось! в evernote
Комментарии (4):
Irina_khlebn 02-02-2016-21:19 удалить
Классная задумка! Очень симпатично.
[550x497]
Ответ на комментарий Irina_khlebn # Классно,Иринка,может дорастём с постов с такой рамочкой!
Irina_khlebn 02-02-2016-21:32 удалить
Ответ на комментарий Нинуля_Смолина # Нинуля, а чего там дорастать? Все уже разжевано. Только бери формулу и подставляй свой текст, фото. Ты ведь любишь стихи оформлять в рамочки. Могу тебе подбросить стихи о России, если хочешь. У меня серия сообщений есть "Россия". Да у тебя, наверное, тоже есть материал в такой рубрике.
Ответ на комментарий Irina_khlebn # Да,есть,Иринка, надо только собраться с духом !


Комментарии (4): вверх^

Вы сейчас не можете прокомментировать это сообщение.

Дневник Рамочки с флагом своей страны. | Нинуля_Смолина - Дневник Нинуля_Смолина | Лента друзей Нинуля_Смолина / Полная версия Добавить в друзья Страницы: раньше»