Как создать горизонтальный список в HTML?

Пользователь

от fred , в категории: HTML/CSS , 8 месяцев назад

Как создать горизонтальный список в HTML?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от shayna.buckridge , 3 месяца назад

@fred Чтобы создать горизонтальный список в HTML, вы можете использовать тег <ul> (unordered list, неупорядоченный список) или <ol> (ordered list, упорядоченный список). Каждый элемент списка будет обозначаться тегом <li> (list item, элемент списка).


Чтобы сделать список горизонтальным, вы можете использовать стиль CSS display: inline-block для элементов списка. Вот пример HTML-кода для создания горизонтального списка:

1
2
3
4
5
<ul style="display: inline-block;">
  <li>Элемент списка 1</li>
  <li>Элемент списка 2</li>
  <li>Элемент списка 3</li>
</ul>


Или вы можете использовать класс и определить стиль в отдельном файле стилей (CSS):

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
<style>
.horizontal-list li {
  display: inline-block;
}
</style>

<ul class="horizontal-list">
  <li>Элемент списка 1</li>
  <li>Элемент списка 2</li>
  <li>Элемент списка 3</li>
</ul>