Мобильный LiveInternet Шпаргалка по линиям | Ольга_Шин

Авторизация

Дневник Ольга_Шин Лента друзей - Дневник - Полная версия

Шпаргалка по линиям 23-11-2015 15:38 к комментариям - к полной версии - понравилось!

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

HTML шпаргалка по линиям

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

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

ее код:<hr>

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

ее код:<hr align=center width=60%>

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

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

<hr noshade>

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

<hr noshade width=60% size="3">

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

<hr size=3 color="#FF0000">

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

<hr color="#00B344"><br /> <textarea width="60%"" rows="1" cols="40"><hr noshade align="center" width="3" size="50">

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

<hr size="5" width="60%" align="center" color="blue">

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

<hr color="blue" size="7" style="border: dotted 5pt; border-color: red ">

Меняем цвет.

<hr color="red" size="9" style="border: dotted 5pt; border-color: blue ">

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

<hr color="black" size="4" style="border: dashed 5pt; border-color: aqua ">

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

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

оформленные в виде текстового абзаца:
<p align=center style=color:blue;>~~~~~~~~~~~~~~~~~~~~~~~~</p>

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

Если нужно прижать линию к левой кромке записи, вместо 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>

Вот в основном и все коды по линиям. Просто копируйте нужный код понравившейся вам линии и ставьте в свободную строчку. И линия появится у вас.

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

Серия сообщений "Шпаргалки":

Часть 1 - Как сделать бегущую строку и бегущее изображение в дневнике
Часть 2 - Несколько оригинальных формул и ссылок для дневника
...
Часть 14 - Он-лайн графические редакторы
Часть 15 - Бродилка по РУБРИКАМ моего дневника.
Часть 16 - HTML шпаргалка по линиям

вверх^ к полной версии понравилось! в evernote

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

Дневник Шпаргалка по линиям | Ольга_Шин - Дневник Ольга_Шин | Лента друзей Ольга_Шин / Полная версия Добавить в друзья Страницы: раньше»