Как написать подчеркнутый и зачеркнутый текст, разделительные линии с настройкой размера и цвета
Доброго времени суток всем, кто забежал за информацией. Сегодня мы будем работать с текстом и горизонтальными-вертикальными разделительными линиями для наших постов.
В одном из своих сообщений я уже писала немного о разделительных линиях, но в этом посте решила написать более развернуто, тем более что здесь дана информация о вставке линий справа, слева и по центру. Научимся писать зачеркнутый текст, также посмотрите как можно подчеркнуть текст двойной линией, точками и пунктирной линией. Итак, кто заинтересован, смотрим внимательно дальше.
Самая простая линия на всю ширину страницы
<hr>
Цветная простая линия на всю ширину страницы
<hr color="#0e5198">
Линия по центру, можно настроить ширину
<hr align=center width=80%>
Такая ширина линии
<hr align=center width=50%>
Разделительная линия выровнена по левому краю;
<hr width=100 align="left">
Разделительная линия выровнена по правому краю
<hr width=100 align="right">
Цветные разделители справа и слева
<hr color="#0e5198"width=100 align="right">
<hr color="#871F78"width=100 align="left">
Разделитель выровнен по ширине
<hr width=100 align="justify">
Цветной разделитель, выровнен по заданной ширине
<hr color="#0e5198";width=100 align="justify">
Цветная разделительная линия по ширине страницы, где size=8-толщина разделителя;
<hr color="#0e5198";size=8>
Если установить больший вертикальный размер линии (size) и минимальный горизонтальный (width), то получим вертикальную линию:
А теперь поработаем немного с текстом:
<span style="border:2px solid blue; padding:3px;"><span style="color:red;">Красный текст в синей рамке</span></span>
Красный текст в синей рамке
Серый текст в коричневой рамке
Текст оранжевого цвета в зеленой рамке
Здесь, чтобы изменить цвет, надо название цвета написать на английском языке.
Текст на заданном фоне
<span style="background-color: green; color: brown; padding: 3px;">Коричневый текст на зеленом фоне</span>
Коричневый текст на зеленом фоне
Зачеркнутый текст
<span style="color:green;text-decoration:line-through;"><span style="color:green;">Ваш текст </span></span> ;
Ваш зачеркнутый текст ;
Подчеркнутый текст
<span style="color:brown;text-decoration:underline;"><span style="color:brown">Ваш текст</span></span>
Ваш подчеркнутый текст
Текст, подчеркнутый пунктирной, двойной и линией точками
<span style="border-bottom: 2px dashed green;">Ваш текст, подчеркнутый пунктирными точками</span>
Ваш текст, подчеркнутый пунктирными точками
Ваш текст, подчеркнутый красными точками
Ваш текст, подчеркнутый двойной линией
В коде измените dashed на dotted (подчеркнуть красными точками), double ( подчеркнуть двойной линией), green-это зеленый цвет текста, измените на свой, также на англ.
И в заключение вот такая разделительная линия
<p align=center style=color:green;>~~~~~~~~~~~~~~~~~~~~~~~~</p>
Здесь также, чтобы изменить цвет (green), впишите название цвета на английском языке;
Получим
~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~
Если захотите расположение справа или слева, замените center на right (справа) и left (слева).
Осенние разделители.
ВераНик
