Стильные рамки со свечением цвета и изображением

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

Так как я не имею возможности вставить все предлагаемые коды рамок в шаблон этого блога, пример рамок будете смотреть в тестовом блоге, а в этом копировать коды приглянувшейся рамки.
Примеры рамок
Код для выделения текста вставляете в шаблон-резервная копия-изменить шаблон. Ищем строку ]] и выше устанавливаем код. Для тех, кто еще не знает как найти строку в шаблоне блога, почитайте пост как быстро и красиво оформить текст в блоге. Далее в редакторе сообщений blogger, где мы пишем свои посты, переходим по вкладке HTML и заключаем необходимый текст вот в такой код:

<div class="code"> код или текст</div>

Code 1
.code1 { margin: 10px; padding: 20px; border: 3px solid #855e42; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; box-shadow: inset 0 0 20px #855e42; -moz-box-shadow: inset 0 0 20px #855e42; -webkit-box-shadow: inset 0 0 20px #855e42; background: #f8f4cb; text-align:justify; color: #108fce; font-weight: bold; }

Code 2
.code2 { margin: 10px; /* отступ рамки от внешних элементов */ padding: 20px; /* отступ вложенного текста от рамки */ border: 3px solid #1e8fce; /* толщина, формат и цвет рамки */ border-radius: 8px; /* радиус скругления углов рамки для IE9 и Opera */ -moz-border-radius: 8px; /* радиус скругления углов рамки для Firefox */ -webkit-border-radius: 8px; /* радиус скругления углов рамки для Safari и Chrome */ box-shadow: inset 0 0 20px #1e8fce; /* смещение, толщина и цвет свечения рамки для Opera */ -moz-box-shadow: inset 0 0 20px #1e8fce; /* смещение, толщина и цвет свечения рамки для Firefox */ -webkit-box-shadow: inset 0 0 20px #1e8fce; /* смещение, толщина и цвет свечения рамки для Safari и Chrome */ background: #fff; /* цвет фона */ text-align:justify; /* выравнивание текста */ color: #108fce; /* цвет текста */ font-weight: bold; /* толщина букв текста */ }

Code 3
.code3 { margin: 10px; padding: 20px; border: 3px solid #029d74; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; box-shadow: inset 0 0 20px #029d74; -moz-box-shadow: inset 0 0 20px #029d74; -webkit-box-shadow: inset 0 0 20px #029d74; background: #f8f8ff; text-align:justify; color: #444444; font-weight: bold; }

Code 4
.code4 { overflow:auto;width:400px;height:auto; font-family: "Consolas", "Courier New", Courier, mono, serif; margin : 15px 35px 15px 15px; padding : 10px 10px 10px 60px; clear : both; color:#000; list-style-type : none; background : #F5F3F3 url(http://1.bp.blogspot.com/-2ZYI5ROjqm0/TwGVjrytNjI/AAAAAAAACLs/AzzX67VYjCw/s1600/1.JPG) repeat-y top left; border : 1px solid #ccc; border-right:15px solid rgba(0, 0, 0, .100); -webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px; -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, .3); -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, .3); box-shadow: 0px 0px 10px rgba(0, 0, 0, .3); } .code4:hover{ overflow:auto;width:400px;height:auto; background : #F5F3F3 url(http://1.bp.blogspot.com/-2ZYI5ROjqm0/TwGVjrytNjI/AAAAAAAACLs/AzzX67VYjCw/s1600/1.JPG) repeat-y top left; border : 1px solid #ccc; border-right:15px solid rgba(0, 0, 0, .100); -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, .3); -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, .3); box-shadow: 0px 0px 10px rgba(0, 0, 0, .3); }

Code 5
.code5 { margin : 15px 35px 15px 15px; padding : 20px 10px 10px 40px; background : #f8f4cb url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6zGKJX7GfJDSeKruagLr6LshF7NOkSrzQKkElUiVj74dJyhz-PR7S4wHyG98-Kelo5Mg2fYes3cdtYlp71ikn9LMG41oyzrCdmucxeNcudOW8EdABp7AQpQmpxSYjAhLx9qCVWaSkcUWN/s800/kod.jpg) repeat-y top left; border-top : 1px solid #800000; border-right : 1px solid #800000; border-bottom : 1px solid #800000; border-left : 1px solid #800000; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

Code 6
code6 { overflow:auto;width:400px;height:auto; font-family: "Consolas", "Courier New", Courier, mono, serif; color:#7A6417; margin : 15px 35px 15px 15px; padding : 10px 10px 10px 35px; clear : both; list-style-type : none; background : #000000 url(http://1.bp.blogspot.com/-GYYwrX408NQ/Tv7JAIEwfMI/AAAAAAAACHc/w8IcSIvTsmc/s1600/000.JPG) repeat-y top left; border : 1px solid #D8C37D; -webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border--moz-border-radius: 23px 20px 20px 20px;border-radius: 23px 20px 20px } .code6:hover{ border : 1px solid #D8C37D; -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, .3); -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, .3); box-shadow: 0px 0px 10px rgba(0, 0, 0, .3); -moz-border-radius: 23px 20px 20px 20px;border-radius: 23px 20px 20px }

Code 7
.code7 { overflow:auto;width:503px;height:120px; font-family: "Consolas", "Courier New", Courier, mono, serif; color:#eeeeee; margin : 15px 35px 15px 15px; padding : 10px 10px 10px 35px; clear : both; list-style-type : none; background : #b561ff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLLOHlQaS4cP1rTL5ybMc6TLrUrJ20RwRUoZ0dSFpcMJ0IxAYDd6cfe6VkkohZNHZhcgjtlbJbXnxzOrm9DjoHZZttFUIb1MZtAqyddmnk1xILXIGRmTnTzAZydpRbfiFvFv_o9_U0wvM/s1600/v-gol.ru+lamp3.JPG) repeat-y top left; border : 2px solid #b561ff; border-left:20px solid #b561ff; -webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border--moz-border-radius: 23px 20px 20px 20px;border-radius: 23px 20px 20px } .code7:hover{ background : #3d162e url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimPneI3NjjR2IvG6FlA0ktnqFwJsQWhns0gW-imq84kD9l4s8MTUOpsZtKYTVlGDJJ0rwN3eDYWKNa27RGLUDwcqCidswmYBjyStUlYzs_oebkD5vwZ5ZaSaNZjuNmyR-NNWqrvVcLOwND/s1600/v-gol.ru+lamp3.JPG) repeat-y top left; color:#fff; border : 2px solid #b561ff; border-left:20px solid #b561ff; -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, .3); -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, .3); box-shadow: 0px 0px 10px rgba(0, 0, 0, .3); box-shadow: 10px 10px 5px #888888; }
источник