Как сделать красивый текст html
LiveInternetLiveInternet
—Рубрики
—Приложения
—Всегда под рукой
—Поиск по дневнику
—Подписка по e-mail
—Постоянные читатели
—Статистика
РАБОТА С ТЕКСТОМ. html коды для текста
Сегодня мы поговорим о шрифтах, тексте, его основных формулах, и различном написании.
Красиво написанный текст или оформленный заголовок всегда привлекает внимание к себе. Но не все знают как сделать это, да и трудно удержать в голове различные теги и формулы. Поэтому в этом посте собраны все основные теги и формулы по написанию и оформлению текста. Просто вписывайте свой текст в данные коды, и ваш текст будет выглядеть как в этих примерах. Значения размеров, толщину и цвет в кодах всегда можно поменять на свои.
УВЕЛИЧЕННЫЙ ТЕКСТ
ТЕКСТ КУРСИВ
ЖИРНЫЙ КУРСИВ
ПОДЧЕРКНУТЫЙ КУРСИВ
СРЕДНИЙ ТЕКСТ
ОЧЕНЬ КРУПНЫЙ ТЕКСТ
ОЧЕНЬ МЕЛКИЙ ТЕКСТ
Супермелкий шрифт. Например: Я хочу тебе тихонько сказать Или: Я хочу тебе тихонько сказать
Минимальное значение font-size:1pt (самый мелкий)
Меняем вид шрифта:
КРАСИВЫЙ ПРОПИСНОЙ ШРИФТ
ВНИМАНИЕ. Таблица кодов цветов НАХОДИТСЯ ЗДЕСЬ
Для желающих поэкспериментировать с текстом есть очень интересный сайт typetester.org
МЕНЯЕМ ШРИФТА И ЦВЕТ ТЕКСТА
СИНИЙ ТЕКСТ ПЕРЕЧЕРКНУТ КРАСНОЙ ЛИНИЕЙ Цвета текста и линии можно менять.
Синий текст подчеркнут красной линией
Синий текст в красной рамке Цвета текста и рамки можно менять.
Цветной текст с цветным фоном Цвета текста и фона можно менять.
Цветной текст с цветным фоном в цветной рамке
Текст, подчеркнутый пунктиром
Текст, подчеркнутый точками
Текст, подчеркнутый двойной чертой
Текст, окаймленный разноцветным пунктиром Все цвета можно менять.
Текст в двойной рамке
Цветной текст в двойной цветной рамке Цвета меняйте по своему вкусу
Ваш текст в объемной 3D-рамке
На заметку:
Тег span (строчный) во всех приведенных примерах можно заменять на div (блочный элемент) и тогда получим рамку во всю ширину поста.
Лучшие сервисы для подбора цвета:
Выделение первой буквы в предложении, или так называемая «буквица»:
Ж или были дед да баба…
Всплывающее окошко с пояснением при наведении на текст курсора (подведите курсор к следующему тексту):
Ваш основной текст текст
Текст «наоборот»:
Перевернуть текст задом-наперед
Значения можно менять
Приподнять фразу на 5 пикселей над текстом (значение можно менять)
Опустить фразу (значение можно менять)
Выделение цитаты в тексте.
Пример:
Выделяем следующую фразу:
Выделение цитаты С ЭФФЕКТОМ ПОДСВЕТКИ (наведите курсор на текст):
Выделение цитаты С ЭФФЕКТОМ ПОДСВЕТКИ
Код:
| текст левой колонки | текст правой колонки |
Правильное (и уважительное) указание автора под скопированным текстом (цитатой) с всплывающей доп. информацией при наведении курсора на имя автора
Пример
“Тег-закрепитель” (фиксирует текст так, как и расположите его в поле поста):
Есть особенность. Текст, заключенный в тег pre отобразится в окне браузера так называемым «моноширинным» шрифтом. Обычно в качестве такого шрифта используется Courier New. Если вас это не устраивает, воспользуйтесь встроенными стилями и назначьте свой шрифт:
Текст, обтекаемый другим текстом:
Сегодня мы поговорим о шрифтах, тексте, его основных формулах, и различном написании.
Красиво написанный текст или оформленный заголовок всегда привлекает внимание к себе. Но не все знают как сделать это, да и трудно удержать в голове различные теги и формулы. Поэтому в этом посте собраны все основные теги и формулы по написанию и оформлению текста. Просто вписывайте свой текст в данные коды, и ваш текст будет выглядеть как в этих примерах. Значения размеров, толщину и цвет в кодах всегда можно поменять на свои.
Написать текст, имея фоном картинку:
Выравнивание текста HTML-кодом
Исходный код для выравнивания текста по левому краю:
Исходный код для выравнивания текста по правому краю:
Исходный код для выравнивания текста по центру:
Выравнивание текста по обеим сторонам: