---

Таблицы для подбора цвета:

 ТАБЛИЦА “БЕЗОПАСНЫХ” ЦВЕТОВ |  “КОЛЕСО” ЦВЕТОВ |  ЕЩЕ ТАБЛИЦА

---

Аббревиатура: HTML

<acronym title="Hiper Text Markup Language">HTML</acronym>

---

Так называемый “спойлерный” текст, проявляющийся при его выделении. Типа:
“А убийцей в том кино был дворецкий”

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

---

Так называемая “буквица”: В некотором царстве…

<font size="+4" face="Monotype Corsiva" color="#0000FF">В</font> <i>некотором царстве…</i>

---

Всплывающее окошко с пояснением при наведении на текст курсора (подведите курсор к следующему тексту):

Ваш офигительно креативный текст

<p title="Пояснительный текст">Основной текст</p>

---

Текст “наоборот”:

Повернуть текст задом-наперед

<bdo dir="rtl">Повернуть текст задом-наперед</bdo>

---

<div style="word-spacing: 20px;">Расстояние между словами</div>

---

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

---

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

---

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

---

Невидимый фрагмент записи (интересно, что невидим даже в OperaMini, хотя мобильные браузеры игнорируют многие стилевые настройки):

<div style="visibility: hidden;">Невидимый фрагмент записи</div>

---

Еще способ скрыть текст:

<!– Ваша служебная невидимая пометка –>

---

Приподнять одну фразу на 5 пикселей над текстом

Приподнять <span style="position: relative; top:-5px;">фразу</span>

---

Опустить одну фразу на 5 пикселей ниже текста

Опустить <span style="position: relative; bottom:-5px;">фразу</span>

---

Повернуть текст на 90 градусов (работает только в IE):

Раз, два, три, четыре, пять, шесть, семь

<span style=writing-mode:tb-rl;>Текст</span>

---

Следующий трюк, напротив, работает только в Opera и Mozilla FF:

Раз, два, три, четыре, пять, шесть

<span style=text-decoration:blink;>TEXT</span>

---

Выделение цитаты в тексте.

Пример:

Еще поэт-романтик Новалис писал в Средние Века:

<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>

---

Написать текст, имея фоном картинку:

<div style="font-size: 15px; font-weight: bold; font-family: Georgia; color: white; padding: 8px; background-image:url("URL картинки");"> ТЕКСТ</div>

Лучше брать маленькую картинку - она будет автоматом повторяться, пока продолжается текст. Атрибутами width и height в % или px (пикселах) можно задать определенный размер фоновой области

---

Эффект с подсветкой текста (наведите курсор на текст):

в некоторых блогсервисах (жж) может не работать

МОЙ ЗАМЕЧАТЕЛЬНЫЙ И КРЕАТИВНЫЙ ТЕКСТ

<font onmouseover="style.backgroundColor='pink'; style.cursor='hand'" onMouseOut="style.backgroundColor='silver';">МОЙ ТЕКСТ</font>

---

Разбить текст на две колонки:

текст левой колонки

текст правой колонки

Код:

<table width=100%>

<tr><td width=50%>

текст левой колонки

<td width=50%>

текст правой колонки

</table>

---

Правильное (и уважительное) указание автора под скопированным текстом (цитатой) с всплывающей доп. информацией при наведении курсора

Пример

<div align=right><cite title="Информация">&copy; АВТОР</cite></div>

---

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

Я

  Пешу

       Лесинкой!!!

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

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

C

     Днем

               Рождения!

<pre style="font-family:'Arial Black'">ваш текст</pre>