Маркированный список в Html

Маркированный список в HtmlМаркированный список в Html очень похож на нумерованный, здесь лишь отличие в том, что вместо цифр рядом с каждым элементом, отображаются другие значки. Это могут быть точки, кружочки или квадратики, в общем, то, что мы укажем.

Чтобы в Html вызвать маркированный список нужно воспользоваться тегами <ul> </ul>, а каждый элемент как обычно поместить в теги  <li> </li>.

Давайте рассмотрим это на примере, мне нужно вывести в маркированный список четыре строчки с разными городами Киев, Москва, Минск, Питер.

В коде Html это будет вот так:

<ul>
<li> Киев </li>
<li> Москва </li>
<li> Минск </li>
<li> Донецк </li>
</ul>

А в браузере это уже отобразиться вот таким образом:

  • Киев
  • Москва
  • Минск
  • Донецк

Как видите, здесь у нас маркер в виде закрашенного кружочка, он стоит по умолчанию. Если мы хотим его изменить, то нам нужно прописать для тега <ul> атрибут type, у него могут быть следующие значения:

circle — круг не закрашенный
square — квадратик
disc – закрашенный круг

Вот смотрите, как можно использовать атрибут type с его значениями:

<ul type=”disc”>
<li> Киев </li>
<li> Москва </li>
<li> Минск </li>
<li> Донецк </li>
</ul>

А в браузере это будет выглядеть вот так:

  • Киев
  • Москва
  • Минск
  • Донецк

Вот так использовать маркированные списки в Html, легко и просто!

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *