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

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

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

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

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

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

от mona_terry , 3 месяца назад

@dorothea_stoltenberg 

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


Чтобы сделать список горизонтальным, вы можете использовать стиль CSS display: flex для тега <ul>. Например:

1
2
3
4
5
<ul style="display: flex">
  <li>Элемент 1</li>
  <li>Элемент 2</li>
  <li>Элемент 3</li>
</ul>


Вы также можете использовать классы и определить стили в отдельном файле стилей (CSS), чтобы избежать загромождения HTML-кода стилями. Например:

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

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


Вы также можете использовать тег <nav> вместо <ul>, чтобы показать, что этот список является навигационным меню. Например:

1
2
3
<nav class="horizontal-list">
  <a href="#">Ссылка 1</a>
  <a href="#">Ссылка 2</a>