Интересное оформление текста - 3 - ...

Вторник, 20 Декабря 2016 г. 22:10 + в цитатник

*

*1. Так называемый «спойлерный» текст, проявляющийся при его выделении (закрашивании) мышкой (как при копировании текста).
Например:
Загадка видна всем, а отгадку увидим только при выделении -
«Зимой и летом одним и тем же цветом»ответ «МЕНЮ В СТОЛОВОЙ»

<span style="background-color:#FFFFFF; color:#FFFFFF">спойлерный текст</span>

*2. Текст подчеркнутый

пунктиром, точками, двойной линией

- меняем значения ЛИНИИ:
dashed, double, dotted.

<span style="border-bottom: 2px ВИД ЛИНИИ red;">ВАШ ТЕКСТ</span>

*3. Выделение цитаты в тексте на другом фоне.
Пример, выделяем следующую фразу:

Внимание, это пояснение очень важное

<div style="border-right: #000080 1px solid; padding-right: 4px; border-top: #000080 1px solid; padding-left: 3px; font-size: 92%; padding-bottom: 4px; border-left: #000080 1px solid; color: #000080; padding-top: 2px; border-bottom: #000080 1px solid; background-color: #f0f0ff"> ТЕКСТ ЦИТАТЫ</div>

*4. Приподнять фразу над текстом ^{(значение можно менять)}

*5. Опустить фразу _{(значение можно менять)}

*6. Тег-закрепитель (фиксирует текст так, как и расположите его в поле поста):

Я
Пишу
Лесенкой!!!

<pre>ваш текст</pre>

Есть особенность: текст, заключенный в тег pre отобразится в окне браузера так называемым «моноширинным» шрифтом. Обычно в качестве такого шрифта используется Courier New. Если вас это не устраивает, воспользуйтесь встроенными стилями и назначьте свой шрифт:

C
Днем
Рождения!

<pre style="font-family:'ВАШ ШРИФТ'">ваш<br /> текст</pre>

*7. Увеличиваем расстояние между словами

-
Значения можно менять

<div style="word-spacing: 20px;">ВАШ ТЕКСТ</div>

-
ОЧЕНЬ большое расстояние между словами

<div style="word-spacing: 40px;">Больше расстояние между словами</div>

*8. Расстояние между буквами

Значение 10px можно менять

<div style="letter-spacing: 10px;">Расстояние между буквами</div>

*9. А здесь задано расстояние между строками (по вертикали)
пятьдесят пикселов, как видите растояние между строчками сразу увеличилось. Значение пикселей можно менять

<div style="line-height:50px;">Расстояние между строками</div>
*

Серия сообщений "*******ШПРАГАЛКИ":
Часть 1 - Рамочки в 1 слой...
Часть 2 - СПЕЦКОДЫ для оформления поста -1-
Часть 3 - ВСЁ, или почти всё, O ССЫЛКАХ — оформление и коды...
Часть 4 - Коды при оформлении ТЕКСТА (выделение цитаты, эпиграф, расположение текста в столбиках)...- 2 -
Часть 5 - Интересное оформление текста - 3 - ...
Часть 6 - Бегущие строчки...
Часть 7 - Оформление Текста - 4 - ... ПРОКРУТКА ТЕКСТА... Как вставить ПРОКРУТКУ в пост.
...
Часть 20 - И снова — «Рамочка-книжка»
Часть 21 - ***МОИ маленькие находки...
Часть 22 - ***Бегущая строка

Процитировано 6 раз
Понравилось: 4 пользователям

<a href="https://www.liveinternet.ru/users/6133629/post406442795/">РРЅС‚РµСЂРµСЃРЅРѕРµ РѕС„РѕСЂРјР»РµРЅРёРµ С‚РµРєСЃС‚Р°  - 3 - ...</a><br/>

*   *1. РўР°Рє РЅР°Р·С‹РІР°РµРјС‹Р№ В«СЃРїРѕР№Р»РµСЂРЅС‹Р№В» С‚РµРєСЃС‚, РїСЂРѕСЏРІР»СЏСЋС‰РёР№СЃСЏ РїСЂРё РµРіРѕ РІС‹РґРµР»РµРЅРёРё (Р·Р°РєСЂР°С€РёРІР°РЅРёРё) РјС‹С€РєРѕР№ (РєР°Рє РїСЂРё РєРѕРїРёСЂРѕРІР°РЅРёРё С‚РµРєСЃС‚Р°). 
РќР°РїСЂРёРјРµСЂ: 
Р—Р°РіР°РґРєР° РІРёРґРЅР° РІСЃРµРј, Р° РѕС‚РіР°РґРєСѓ СѓРІРёРґРёРј С‚РѕР»СЊРєРѕ РїСЂРё РІС‹РґРµР»РµРЅРёРё - 
В«Р—РёРјРѕР№ Рё Р»РµС‚РѕРј РѕРґРЅРёРј Рё С‚РµРј Р¶Рµ С†РІРµС‚РѕРјВ»РѕС‚РІРµС‚ В«РњР•РќР® Р’ РЎРўРћР›РћР’РћР™В»
СЃРїРѕР№Р»РµСЂРЅС‹Р№ С‚РµРєСЃС‚ 
*2. РўРµРєСЃС‚ РїРѕРґС‡РµСЂРєРЅСѓС‚С‹Р№ 
 РїСѓРЅРєС‚РёСЂРѕРј,  С‚РѕС‡РєР°РјРё,  РґРІРѕР№РЅРѕР№ Р»РёРЅРёРµР№
 - РјРµРЅСЏРµРј Р·РЅР°С‡РµРЅРёСЏ Р›РРќРР:  dashed, double, dotted.
Р’РђРЁ РўР•РљРЎРў

*3. Р’С‹РґРµР»РµРЅРёРµ С†РёС‚Р°С‚С‹ РІ С‚РµРєСЃС‚Рµ РЅР° РґСЂСѓРіРѕРј С„РѕРЅРµ.
РџСЂРёРјРµСЂ, РІС‹РґРµР»СЏРµРј СЃР»РµРґСѓСЋС‰СѓСЋ С„СЂР°Р·Сѓ: 
Р’РЅРёРјР°РЅРёРµ, СЌС‚Рѕ РїРѕСЏСЃРЅРµРЅРёРµ РѕС‡РµРЅСЊ РІР°Р¶РЅРѕРµ
 РўР•РљРЎРў Р¦РРўРђРўР« 
*4. РџСЂРёРїРѕРґРЅСЏС‚СЊ С„СЂР°Р·Сѓ РЅР°Рґ С‚РµРєСЃС‚РѕРј (Р·РЅР°С‡РµРЅРёРµ РјРѕ... <a href="https://www.liveinternet.ru/users/6133629/post406442795/">Р§РёС‚Р°С‚СЊ РґР°Р»РµРµ...</a>