Урок №4. Текст на странице(часть 2).

Содержание урока:

Тег горизонтальной линии.
Тег упорядоченного списка.
Тег неупорядоченного списка.


 

Тег горизонтальной линии.

<hr> — все очень просто. Этот тег рисует горизонтальную линию в окне браузера. Закрывающий тег отсутствует.

Атрибуты:

   Align – выравнивание линии.

   Color – задает цвет линии.

   Noshade – линия без 3D эффекта.

   Size – задает толщину линии.

   Width – задает ширину линии.

Пример:

   <hr>

   <p>Если человек действительно чего-то захочет, то вся Вселенная будет способствовать тому, чтобы его желание сбылось.</p>

   <hr color="red">

   <p>Если тебя выписали из сумасшедшего дома, это еще не значит, что тебя вылечили. Просто ты стал как все.</p>

   <hr size="10px">

   <hr size="15px">

   <hr size="30px">

 

Вид в браузере:

Пример тега

 


 

Тег упорядоченного списка.

<ol> — данный тег создает нумерованный список. Закрывающий тег обязателен.

Элементами данного тега является тег <li>, это так званая ячейка для каждого пункта из списка, находится внутри тега <ol>.Каждый пункт списка должен начинаться с нового тега <li>. Закрывающий тег обязателен.

Атрибут тега <li>:

    Value – изменяет порядок нумерации.

Атрибуты тега <ol> :

    Start – указывает число, с которого будет начинаться список.

    Reversed – нумерация списка будет в обратном порядке.

    Type – задает тип маркера.

Типы маркеров:

    «A» – заглавные буквы A, B, C …

    «a» – строчные буквы a, b, c …

    «I» – большие римские числа I, II, III …

    «i» – маленькие римские числа i, ii, iii …

    «1» – арабские числа 1, 2, 3 …

По умолчанию, маркера выводятся в виде арабских чисел.

Пример:

Список покупок:

<ol type="I">

<li>Сахар </li>

<li>Соль </li>

<li>Чай </li>

</ol>

<hr> 

Планы на сегодня:

<ol type="A">

<li>Посетить сайт htmlless.com </li>

<li>Выучить 4 урок HTML </li>

<li>Закрепить знания </li>

</ol>

<hr> 

Планы на сегодня:

<ol reversed>

<li>Посетить сайт htmlless.com </li>

<li value="231">Выучить 4 урок HTML </li>

<li>Закрепить знания </li>

</ol>

 

Вид в браузере:

Пример упорядоченного списка с атрибутами

 

Думаю принцип Вы поняли. Попрактикуйтесь.


Тег неупорядоченного списка.

 

    — тег, который создает неупорядоченный список. Элементами тега является тот самый тег

. Закрывающий тег обязателен.

Атрибут:

    Type – изменяет вид маркера, который размещен у начала пункта списка.

Возможные значения:

        — type=»disc« — закрашенный кружочек.

        — type=»circle» — пустой кружочек.

        — type=»square» — закрашенный квадратик.

Пример:

<ul>

<li>Первый пункт</li>

<li>Второй пункт</li>

<li>Третий пункт</li>

</ul>

Вид в браузере:

 

  • Первый пункт
  • Второй пункт
  • Третий пункт

 

Ну все, практикуйтесь.
Жду Вас на следующем уроке. Будет интересно.

Закрыть меню