Примеры рамок для выделения текста
Code1
Я убежден, что единственной вещью, которая помогла мне продолжить дело было то, что я любил свое дело. Вам надо найти то, что Вы любите. И это также верно для работы, как и для отношений. Стив Джобс.
Code2
Я убежден, что единственной вещью, которая помогла мне продолжить дело было то, что я любил свое дело. Вам надо найти то, что Вы любите. И это также верно для работы, как и для отношений. Стив Джобс.
Code3
Я убежден, что единственной вещью, которая помогла мне продолжить дело было то, что я любил свое дело. Вам надо найти то, что Вы любите. И это также верно для работы, как и для отношений. Стив Джобс.
Code4 (подведите курсор мыши к рамке)
Я убежден, что единственной вещью, которая помогла мне продолжить дело было то, что я любил свое дело. Вам надо найти то, что Вы любите. И это также верно для работы, как и для отношений. Стив Джобс.
Code5
Я убежден, что единственной вещью, которая помогла мне продолжить дело было то, что я любил свое дело. Вам надо найти то, что Вы любите. И это также верно для работы, как и для отношений. Стив Джобс.
Code6
Я убежден, что единственной вещью, которая помогла мне продолжить дело было то, что я любил свое дело. Вам надо найти то, что Вы любите. И это также верно для работы, как и для отношений. Стив Джобс.
Code7 (подведите курсор мыши к рамке)
Я убежден, что единственной вещью, которая помогла мне продолжить дело было то, что я любил свое дело. Вам надо найти то, что Вы любите. И это также верно для работы, как и для отношений. Стив Джобс.
Выбирайте рамки для оформления текста в Ваших блогах, копируйте коды.
Code1
Code2
Code3
Code4 (подведите курсор мыши к рамке)
Code5
Code6
Code7 (подведите курсор мыши к рамке)
Выбирайте рамки для оформления текста в Ваших блогах, копируйте коды.
Я убежден, что единственной вещью, которая помогла мне продолжить дело было то, что я любил свое дело. Вам надо найти то, что Вы любите. И это также верно для работы, как и для отношений. Стив Джобс.
Code2
Я убежден, что единственной вещью, которая помогла мне продолжить дело было то, что я любил свое дело. Вам надо найти то, что Вы любите. И это также верно для работы, как и для отношений. Стив Джобс.
Code3
Я убежден, что единственной вещью, которая помогла мне продолжить дело было то, что я любил свое дело. Вам надо найти то, что Вы любите. И это также верно для работы, как и для отношений. Стив Джобс.
Code4 (подведите курсор мыши к рамке)
Я убежден, что единственной вещью, которая помогла мне продолжить дело было то, что я любил свое дело. Вам надо найти то, что Вы любите. И это также верно для работы, как и для отношений. Стив Джобс.
Code5
Я убежден, что единственной вещью, которая помогла мне продолжить дело было то, что я любил свое дело. Вам надо найти то, что Вы любите. И это также верно для работы, как и для отношений. Стив Джобс.
Code6
Я убежден, что единственной вещью, которая помогла мне продолжить дело было то, что я любил свое дело. Вам надо найти то, что Вы любите. И это также верно для работы, как и для отношений. Стив Джобс.
Code7 (подведите курсор мыши к рамке)
Я убежден, что единственной вещью, которая помогла мне продолжить дело было то, что я любил свое дело. Вам надо найти то, что Вы любите. И это также верно для работы, как и для отношений. Стив Джобс.
Выбирайте рамки для оформления текста в Ваших блогах, копируйте коды.
Семь рамок для выделения текста в блоге
Здравствуйте гости и читатели моего блога. Сегодня предлагаю для выделения текста в Ваших блогах семь стильных рамок со свечением цвета и изображениями. В моем блоге достаточно информации о разных типах рамок, но со свечением цвета не было. Поэтому выбирайте, оформляйте, чтобы блоги Ваши надолго запомнились посетителям и привлекали новых читателей.
Так как я не имею возможности вставить все предлагаемые коды рамок в шаблон этого блога, пример рамок будете смотреть в тестовом блоге, а в этом копировать коды приглянувшейся рамки.
Примеры рамок
Код для выделения текста вставляете в шаблон-резервная копия-изменить шаблон. Ищем строку ]]</b:skin> и выше устанавливаем код. Для тех, кто еще не знает как найти строку в шаблоне блога, почитайте пост как быстро и красиво оформить текст в блоге. Далее в редакторе сообщений blogger, где мы пишем свои посты, переходим по вкладке HTML и заключаем необходимый текст вот в такой код
Код для выделения текста вставляете в шаблон-резервная копия-изменить шаблон. Ищем строку ]]</b:skin> и выше устанавливаем код. Для тех, кто еще не знает как найти строку в шаблоне блога, почитайте пост как быстро и красиво оформить текст в блоге. Далее в редакторе сообщений 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;
}
Code2
.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; /* толщина букв текста */
}
Code3
.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; /* толщина букв текста */
}
Code3
.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;
}
Code4
.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);
}
Code5
.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);
}
Code5
.code5 {
margin : 15px 35px 15px 15px;
padding : 20px 10px 10px 40px;
background : #f8f4cb url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgffIz_82-74R-iNdJPadBgdhCLh9XfHHIziRWCWXMEOKoZIjY-jaewwwEHNMm0TiC9ZSbqUyy8nko9t78A2nTCD_IvCB8k0EIRMtI0qtetRDEaQgt-oLmoIQZ0V21caS8nWm27MX6KlKFy/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;
}
Code6
.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
}
Code7
.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/AVvXsEif8vMVi0QdM1Y5-ld-8TT4dyJ29Lwckk-wG5zgN8A1nnat9FYukokjuc8PseA3W3D0P_1wdDj15CejVYnheTnDJ1ZiXhZUH1FolWxtKHQ_2I8wehjRnTjLpjPgQYdRlFtfNIoZjamJzpg/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/AVvXsEi6B1zRpNBPlETRweNE9mmtufGbPaJhTWG1m4VbRFqHdtvNB2oCkhF9R-H8_orMKJwyqYbPGNRR8tuhDF73vODO5_fhRXkzT-EZLd9AI8sU3B2xV_N4PSl9tCdNCvCXuNYTjHmb9xTAJcpm/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;
}
.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
}
Code7
.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/AVvXsEif8vMVi0QdM1Y5-ld-8TT4dyJ29Lwckk-wG5zgN8A1nnat9FYukokjuc8PseA3W3D0P_1wdDj15CejVYnheTnDJ1ZiXhZUH1FolWxtKHQ_2I8wehjRnTjLpjPgQYdRlFtfNIoZjamJzpg/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/AVvXsEi6B1zRpNBPlETRweNE9mmtufGbPaJhTWG1m4VbRFqHdtvNB2oCkhF9R-H8_orMKJwyqYbPGNRR8tuhDF73vODO5_fhRXkzT-EZLd9AI8sU3B2xV_N4PSl9tCdNCvCXuNYTjHmb9xTAJcpm/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;
}
В коде 2 расписаны все настройки для 1,2,3 рамок. В других кодах настройки простые, я думаю разберетесь. Чуть не забыла еще о тексте. Обратите внимание на заголовок-тень текста. Можно таким образом выделить безо всяких рамок, если необходимо обратить внимание на запись.
<div style="text-shadow: 4px 4px 8px black;">ваш текст</div>
Код устанавливайте в редакторе сообщений, в режиме HTML. Можно также записать текст в виде HTML кода, заключить в этот код и вставить в дизайн-добавить гаджет. Выделенное синим-это цвет тени: black (черный); green (зеленый); brown (коричневый); grey (серый).
У меня на сегодня все. Понравились рамки? Поделитесь со своими друзьями и знакомыми в социальных сетях. Всего всем Доброго и до новых встреч.