Рамки для текста с разным цветом окантовки

Код рамочек для текста и кодов с разными цветами окантовки

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

В принципе, я хотела Вам показать, какие чудеса можно творить, если изменить размер и цвет рамки. Вы можете использовать коды этих рамочек, можете настроить по своему усмотрению цвет и фон рамок. Скопируйте код, в редакторе сообщений blogger вставляйте в режиме HTML.

Белеет парус одинокий В тумане моря голубом !...Что ищет он в стране далекой? Что кинул он в краю родном?...М.Ю. Лермонтов.

<center> <blockquote 15px="" padding:="" style="background: #E6E8FA; border-bottom: #0e9e08 3px solid; border-left: #444444 3px solid; border-right: #0073e9 3px solid; border-top: #FF9900 3px solid; height: 60; padding: 15px; padding: 15px; padding: 15px; width: 400;"> Здесь будет Ваш текст </blockquote> </center>

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

<blockquote 15px="" padding:="" style="background: #603300; border-bottom: #0e9e08 13px solid; border-left: #871F78 13px solid; border-right: #0073e9 13px solid; border-top: #FF9900 13px solid; height: 100; padding: 15px; padding: 15px; padding: 15px; width: 400;"> </blockquote>

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

<center> <blockquote 15px="" inset="" padding:="" style="background: #CDC9A5; border-bottom: #0e9e08 10px solid; border-left: #CDC9A5 13px solid; border-right: #0073e9 10px solid; border-top: #CDC9A5 13px solid; height: 100; padding: 15px; padding: 15px; padding: 15px; width: 400;"> Здесь будет Ваш текст</blockquote> </center>

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

<center> <blockquote 15px="" padding:="" ridge="" style="background: #F8F8FF; border-bottom: #0e9e08 10px solid; border-left: #CDC9A5 13px solid; border-right: #CDC9A5 10px solid; border-top: #CDC9A5 13px solid; height: 100; padding: 15px; padding: 15px; padding: 15px; width: 400;"> Здесь будет Ваш текст</blockquote> </center>

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

<center> <blockquote 15px="" padding:="" ridge="" style="background: #F8F8FF; border-bottom: #eeeeee 5px solid; border-left: #FF9900 10px solid; border-right: #FF9900 7px solid; border-top: #FF9900 10px solid; height: 100; padding: 15px; padding: 15px; padding: 15px; width: 400;"> Здесь будет Ваш текст</blockquote> </center>

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

<center> <blockquote 15px="" padding:="" ridge="" style="background: #F8F8FF; border-bottom: #047AFE 11px solid; border-left: #99CC32 11px solid; border-right: #eeeeee 5px solid; border-top: #eeeeee 5px solid; height: 200; padding: 15px; padding: 15px; padding: 15px; width: 250;"> Здесь будет Ваш текст</blockquote> </center>

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

<center> <blockquote 15px="" padding:="" style="background: #F8F8FF; border-bottom: #0e9e08 5px solid; border-left: #eeeeee 5px solid; border-right: #eeeeee 5px solid; border-top: #029D74 5px solid; height: 60; padding: 15px; padding: 15px; padding: 15px; width: 400;"> Здесь будет Ваш текст </blockquote> </center>

Теперь давайте  рассмотрим настройки кода

<center><blockquote 15px="" padding:="" style="background: #E6E8FA; border-bottom: #0e9e08 3px solid; border-left: #444444 3px solid; border-right: #0073e9 3px solid; border-top: #FF9900 3px solid; height: 60; padding: 15px; padding: 15px; padding: 15px; width: 400;">

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

</blockquote></center>

background: #E6E8FA;-цвет фона рамки; border-bottom: #0e9e08 3px-цвет и размер нижней окантовки рамки; border-left: #444444 3px-цвет и размер левой окантовки рамки; border-right: #0073e9 3px-цвет и размер правой окантовки рамки; border-top: #FF9900 3px-цвет и размер верхней окантовки рамки; width: 400;-ширина рамки; height: 60;-высота рамки;. 

Хочу еще сказать о размерах рамки: у меня в одном их кодов выставлен размер рамки 200х300. В редакторе сообщений рамка именно такого размера, а при просмотре почему то ширина на 100 % страницы. Может это только у меня. 

Когда будете писать текст в рамке, настройте курсор мыши: по центру, слева, справа. Пишите текст и не переносите курсор. Расположение текста будет автоматически выбранным настройкам. На этом все. Говорю Вам До свидания и творческих успехов. Делитесь с друзьями, оставляйте отзывы, замечания.

источник