Рамочки - линии для выделения текста

Пятница, 17 Апреля 2015 г. 16:18 + в цитатник

Цитата сообщения Шадрина_Галина

Прочитать целиком В свой цитатник или сообщество!

Рамочки - линии для выделения текста

Рамочки линии. Такие простые рамочки можно ставить, если просто хочется как-то выделить весь пост, или только самую важную часть его, при этом фон останется ваш.

В рамочку можно вставлять все, что вам захочется, то есть весь ваш пост. Коды каждой такой рамочки внутри конкретной рамки.
Копируйте их, и ставьте в свои записи в Простом редакторе..
Там где написано ВАШ ТЕКСТ- Вставляете свой текст.

В коде рамочек можно заменять цвет ободка рамки, и толщину рамки.
Немного поподробнее об этих кодах.

Посмотрите внимательно на коды таких рамочек. (ниже на рисунке коды нескольких рамочек) Они совершенно одинаковы, и различаются только названием линий, из которых они состоят.

Все, что находится до слов ВАШ ТЕКСТ, Это ОТКРЫВАЮЩИЙ ТЕГ РАМКИ, где и находятся все значения рамки (толщина, цвет, размер. Тег /div, который стоит последним, является закрывающим То есть, где вы его поставите, там и будет заканчиваться рамка.

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

В коде можно заменить цвет ободка рамки. Только заменяйте все очень аккуратно, не задевая других кодов. Находим вот такой значок, он обозначает цвет #FFFACD и меняем цвет на тот, который нужен вам.
Коды цветов HTML НАХОДЯТСЯ ЗДЕСЬ

Толщину линии ободков рамки, так же можно заменять. Она как обычно в пикселях. Находите это значение, и меняете на свое. От этого сразу меняется вид рамки.

Посмотрите на примере как меняется вид рамки.

Рамочка с линией

толщиной 8px

Эта же рамочка, с линией

толщиной 20px

Вот и все настройки по таким рамочкам. Поменять цвет ободков, и толщину стенок рамки совсем несложно. Ставите код рамочки в самом начале вашего поста и все. Если вы берете в рамочку весь ваш пост, то закрывающий тег можете и не ставить, система поставит его сама.
Просто поставьте коды (ДО СЛОВ ВАШ ТЕКСТ), в начале поста, и не заморачивайтесь.

А теперь коды 10 простейших рамочек, с примерами, как выглядят эти рамки.

Ободок рамки выделяется точками.

Меняйте цвет ободков рамки на свой.

КОД рамочки dotted
<div style="border:5px dotted #0000cd;padding:10px;">ВАШ ТЕКСТ.</div>

Ободок рамки - пунктир.

Рамка dashed Цвет краев рамки так же можно поменять на свой. Ищите в коде т#FFFACD и меняйте на цвет, который подходит вам.

КОД рамки dashed
<div style="border:3px dashed #8b0000;padding:10px;">ВАШ ТЕКСТ.</div>

Ободок рамки имеет сплошную линию

solid - ОБОДОК рамки имеет сплошную линию.

КОД рамки solid <div style="border:3px solid #4b0082;padding:10px;">ВАШ ТЕКСТ.</div>

Ободок рамки с двойной обводкой

double - ОБОДОК рамки с двойной робводкой.

КОД рамки double
<div style="border:10px double #006400;padding:10px;">ВАШ ТЕКСТ.</div>

Ободок рамки выделяется в виде кромки

ridge - ОБОДОК рамки выделяется в виде кромки.

КОД рамки ridge
<div style="border:10px ridge #4b0082;padding:10px;">ВАШ ТЕКСТ.</div>

Выпуклый Ободок рамки

outset - ОБОДОК рамки получается выпуклым.

КОД рамки outset
<div style="border:10px outset #800000;padding:10px;">ВАШ ТЕКСТ. </div>

Вдавленный Ободок рамки

inset - ОБОДОК рамки получается вдавленным.

КОД рамки inset
<div style="border:10px inset #f000a0;padding:10px;">ВАШ ТЕКСТ. </div>

Ободок рамки с выемкой

groove -ОБОДОК рамки с выемкой.

КОД рамки groove
<div style="border:10px groove #4169e1;padding:10px;">ВАШ ТЕКСТ. </div>

Рамка с разрывом посредине.

ЗАГОЛОВОК Рамка с разрывом для вставки оглавления или картинки

КОД рамки с разрывом
<center><fieldset style=" border:3px #B22222 solid; padding: 14px; margin:0px 0px 0px 0px;"><legend><font color="#B22222"><b>ЗАГОЛОВОК</b></font></legend>ЗДЕСЬ ПИШЕМ ТЕКСТ</fieldset></center>

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

Все ободки рамки разного цвета. Проставляйте коды цветов очень аккупатно

КОД рамки с разноцветными краями
<center><blockquote style="BORDER-LEFT: #ЦВЕТ ЛЕВОГО БОРДЮРА 3px solid; padding: 15px; BORDER-TOP: #ЦВЕТ ВЕРХНЕГО БОРДЮРА 3px solid; padding: 15px; BORDER-BOTTOM: #ЦВЕТ НИЖНЕГО БОРДЮРА 3px solid; padding: 15px;BORDER-RIGHT: #ЦВЕТ ПРАВОГО БОРДЮРА 3px solid" 15px="15px"><font color="#000000"><center>ЗДЕСЬ ПИШЕМ ТЕКСТ</center></font></blockquote></center>

Пунктирная рамочка с фоном.

ЗДЕСЬ ПИШЕМ ТЕКСТ. Рамочка с белым фоном.

Код рамки с фоном
<center><div style="padding: 10px 10px; background: #f3f3f3; width: 820px; font-size: 25px; font-family: Georgia; color: #790000; border: 2px dashed #790000; border-radius: 3px; box-shadow: 0 0 0 5px #f3f3f3, 3px 2px 7px 4px rgba(10,10,0,.5);"><br />ЗДЕСЬ ПИШЕМ ТЕКСТ</div><br /> <br /> Успехов в вашем творчестве. <br /> <img src="https://img-fotki.yandex.ru/get/17914/65387414.749/0_12090c_3c242a9b_orig.png" width="300" height="51" border="0" title="0_987c4_60480c65_orig.png" alt="0_987c4_60480c65_orig.png" /></center>

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

Часть 1 - Как сделать бегущую строку и бегущее изображение в дневнике
Часть 2 - Несколько оригинальных формул и ссылок для дневника
Часть 3 - Рамочки - линии для выделения текста

Серия сообщений "Уроки по рамочкам+коды":
Часть 1 - Рамочки для текста от Vladarxipoff
Часть 2 - Рамочка новая, поздравительная, новогодняя
...
Часть 25 - Без заголовка
Часть 26 - Рамки вокруг изображения
Часть 27 - Рамочки - линии для выделения текста
Часть 28 - Без заголовка
Часть 29 - Без заголовка
...
Часть 41 - Без заголовка
Часть 42 - Без заголовка
Часть 43 - Без заголовка

Рубрики:

РАМОЧКИ

Понравилось: 1 пользователю

<a href="https://www.liveinternet.ru/users/vladarxipoff/post359637489/">Р Р°РјРѕС‡РєРё - Р»РёРЅРёРё РґР»СЏ РІС‹РґРµР»РµРЅРёСЏ С‚РµРєСЃС‚Р°</a><br/>Р Р°РјРѕС‡РєРё - Р»РёРЅРёРё РґР»СЏ РІС‹РґРµР»РµРЅРёСЏ С‚РµРєСЃС‚Р°

Р Р°РјРѕС‡РєРё Р»РёРЅРёРё. РўР°РєРёРµ РїСЂРѕСЃС‚С‹Рµ СЂР°РјРѕС‡РєРё РјРѕР¶РЅРѕ СЃС‚Р°РІРёС‚СЊ, РµСЃР»Рё  РїСЂРѕСЃС‚Рѕ С…РѕС‡РµС‚СЃСЏ РєР°Рє-С‚Рѕ РІС‹РґРµР»РёС‚СЊ РІРµСЃСЊ РїРѕСЃС‚, РёР»Рё С‚РѕР»СЊРєРѕ СЃР°РјСѓСЋ РІР°Р¶РЅСѓСЋ С‡Р°СЃС‚СЊ РµРіРѕ, РїСЂРё СЌС‚РѕРј С„РѕРЅ РѕСЃС‚Р°РЅРµС‚СЃСЏ РІР°С€.
 Р’ СЂР°РјРѕС‡РєСѓ РјРѕР¶РЅРѕ РІСЃС‚Р°РІР»СЏС‚СЊ РІСЃРµ, С‡С‚Рѕ РІР°Рј Р·Р°С…РѕС‡РµС‚СЃСЏ, С‚Рѕ РµСЃС‚СЊ РІРµСЃСЊ РІР°С€ РїРѕСЃС‚.  РљРѕРґС‹ РєР°Р¶РґРѕР№ С‚Р°РєРѕР№ СЂР°РјРѕС‡РєРё РІРЅСѓС‚СЂРё РєРѕРЅРєСЂРµС‚РЅРѕР№ СЂР°РјРєРё. 
РљРѕРїРёСЂСѓР№С‚Рµ РёС…, Рё СЃС‚Р°РІСЊС‚Рµ РІ СЃРІРѕРё Р·Р°РїРёСЃРё РІ РџСЂРѕСЃС‚РѕРј СЂРµРґР°РєС‚РѕСЂРµ.. 
РўР°Рј РіРґРµ РЅР°РїРёСЃР°РЅРѕ Р’РђРЁ РўР•РљРЎРў- Р’СЃС‚Р°РІР»СЏРµС‚Рµ СЃРІРѕР№ С‚РµРєСЃС‚.
 
Р’ РєРѕРґРµ СЂР°РјРѕС‡РµРє РјРѕР¶РЅРѕ Р·Р°РјРµРЅСЏС‚СЊ С†РІРµС‚ РѕР±РѕРґРєР° СЂР°РјРєРё, Рё С‚РѕР»С‰РёРЅСѓ СЂР°РјРєРё.
РќРµРјРЅРѕРіРѕ РїРѕРїРѕРґСЂРѕР±РЅРµРµ РѕР± СЌС‚РёС… РєРѕРґР°С….

РџРѕСЃРјРѕС‚СЂРёС‚Рµ РІРЅРёРјР°С‚РµР»СЊРЅРѕ РЅР° РєРѕРґС‹ С‚Р°РєРёС… СЂР°РјРѕС‡РµРє... <a href="https://www.liveinternet.ru/users/vladarxipoff/post359637489/">Р§РёС‚Р°С‚СЊ РґР°Р»РµРµ...</a>

Комментировать

« Пред. запись — К дневнику — След. запись »

Страницы: [1] [Новые]

LiveInternetLiveInternet

-Музыка

-Цитатник

-Метки

-Приложения

-Резюме

Архипов Владимир Афанасьевич

-Ссылки

-Фотоальбом

-Рубрики

-Я - фотограф

Мои коллажи

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

-

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

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

-Интересы

-Друзья

-Постоянные читатели

-Сообщества

-Трансляции

-Статистика

Рамочки - линии для выделения текста