• Авторизация


Применяем линии в тексте (html шпаргалка по линиям)... 21-12-2016 01:00 к комментариям - к полной версии - понравилось!

Это цитата сообщения Шадрина_Галина Оригинальное сообщение




***Линии можно применять, например, для того, чтобы делить пост на логические разделы, отделять друг от друга цитаты, мысли, афоризмы.

Вот она, самая простая линия, для ее вставки просто поставьте в строчку Тег hr (Horisontal Rule)


ее код:

***
Линию можно сделать не во всю страницу, а более короткую, разделительную. Ширину проставляем в %. В примере стоит 60%, вы можете поменять на свою.


ее код:

По умолчанию линия имеет толщину 2 пиксела и некоторую объемность.

Необъемная линия



***
Короткая необъемная 60%.



***
У линии можно проставить цвет. Красная линия



***
Зеленая линия



***
Цветную линию так же можно откорректировать по длине.



***
Можно немного пофантазировать и поставить более красивую линию. Цвет так же можно менять.



***
Меняем цвет.



***
И еще одна оригинальная линия.



***
Иногда проще использовать клавиатурные или спец. символы, и получить нарисованную линию:

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


оформленные в виде текстового абзаца:

***
Различные декоративные линии представляют собой картинки Собраний таких картинок в сети очень много. Например можете ВЗЯТЬ ЗДЕСЬ .
***
Если нужно прижать линию к левой кромке записи, вместо align=center ставьте align=left

к правой — align=right
***
Горизонтальные линии.


Тег hr (Horisontal Rule), который вставляет в текст горизонтальную разделительную линию. Может иметь следующие атрибуты:





widthОпределяет длину линии в пикселях или процентах от ширины окна Обозревателя.
sizeОопределяет толщину линии в пикселях.
alignОпределяет выравнивание горизонтальной линии. Параметр может принимать следующие значения:

left - выравнивание по левому краю документа.

right - выравнивание по правому краю документа.

center - выравнивание по центру документа (используется по умолчанию).
hoshadeОпределяет способ закраски линии как сплошной. Параметр является флагом и не требует указания значения. Без данного параметра линия отображается объемной.
colorОпределяет цвет линии. Работает те во всех браузерах.


***
Примеры и коды объемных линий:
ЕЕ код

<hr>



***
Короткая, прижатая к левому краю
ЕЕ код

<hr width="50%" align="left" size="0">




***
Задана длинна и ширина (объем)
ЕЕ код

<hr width="80%" size="4">




***
Объемная с заданной шириой
ЕЕ код

<hr hoshade width="80%" size="20">




***
Цветная объемная с заданной длиной
ЕЕ код

<hr hoshade width="80%" color="Blue" size="8">




***

Вместо линии можно сделать круг (точку):


ЕЕ код

<hr hoshade align="left" width="18" color="Red" size="18">




***

Расположить несколько кругов одну строку, к сожалению, нельзя.


***
Линия по центру, можно настроить ширину


ЕЕ код <hr align=center width=80%>
***
Ширина линии 50 %, расположенная в середине строки.


ЕЕ код <hr align=center width=50%>
***
Разделительная линия выровнена по левому краю;


ЕЕ код <hr width=100 align="left">
***
Разделительная линия выровнена по правому краю


ЕЕ код <hr width=100 align="right">
***
Цветные разделители справа и слева


<hr align="right" color="#0e5198" width="100">
***


<hr align="left" color="#871F78" width="100">
***
Разделитель выровнен по ширине


<hr width=100 align="justify">
***
Цветной разделитель, выровнен по заданной ширине


<hr align="justify" color="#0e5198" width="100">

***
Цветная разделительная линия по ширине страницы, где size=8-толщина разделителя;


<hr color="#0e5198";size=8>
***
Вот в основном и все коды по линиям. Просто копируйте нужный код понравившейся вам линии и ставьте в свободную строчку. И линия появится у вас.

Урок по линиям, (как и где менять толщину линии, ее цвет и размер СМОТРИМ ЗДЕСЬ
0_af4d2_37a681d0_orig.jpg.gif
*




KOD моего оформления>>>

================================

вверх^ к полной версии понравилось! в evernote
Комментарии (6):
ЗИТТА 24-09-2019-11:55 удалить
Вера,объясните мне пожалуйста,почему у меня не получается поставить вертикальную линию с боку текста.Что я делаю не так И как эту вертикальную боковую линию сделать по ширине текста?Я все коды пересматриваю везде ничего у меня не получается.
[700x197]
E-Ledi 30-01-2020-21:49 удалить
Верочка, большое спасибо! Пол вечера ищу, как сделать вертикальную линию.
E-Ledi 31-01-2020-00:01 удалить
Я не смогла поставить линию, чтобы она стояла слева от текста. Предполагаю, что нужно было мне добавить тег выравнивания по левому краю...
Ответ на комментарий E-Ledi # Леночка, удивилась твоему комментарию, т.к. у меня есть два поста по поводу вертикальных линий от 29.09.19 (https://www.liveinternet.ru/users/6133629/post461000312) и от 15.10.19 (https://www.liveinternet.ru/users/6133629/post461620851#) и по-моему, ты их цитировала. Я сейчас редко просматриваю сообщения - занимаюсь ремонтом в квартире. ВСЕГО ДОБРОГО! УДАЧИ!!!


Комментарии (6): вверх^

Вы сейчас не можете прокомментировать это сообщение.

Дневник Применяем линии в тексте (html шпаргалка по линиям)... | Вера_Верочка_Веровь - У самовара | Лента друзей Вера_Верочка_Веровь / Полная версия Добавить в друзья Страницы: раньше»