Как сделать выпадающий список в html

4 года назад

Человек-Молекула

Ответы

Тег в HTML используется для создания выпадающего списка в HTML форме. С помощью атрибута multiple можно создать список с выбором нескольких значений (список с множественным выбором). Пункты выпадающего списка определяются с помощью тега . Тег определяет группы пунктов внутри выпадающего списка HTML.

Пример HTML-документа:

<select name="colors">
  <option value="1">Синий</option>
  <option value="2" selected>Зеленый</option>
  <option value="3">Желтый</option>
  <option value="4">Красный</option>
  <option value="5">Оранжевый</option>
  <option value="6">Черный</option>
</select>

Результат: select-example

4 года назад

Вячеслав Межуревский

Выпадающий список можно через абсолютное позиционирование. HTML код выглядит так:

<nav class="nav">
        <ul>
          <li>
            <span class="nav-title">Проекты</span>
            <ul class="sub-menu">
              <li><a href="#">Обзор и отзывы</a></li>
              <li><a href="#">Что такое проекты?</a></li>
              <li><a href="#">Как подготовиться?</a></li>
            </ul>
          </li>
        </ul>
</nav>

CSS код будет выглядеть так:

.nav li {
  position: relative;
}

.sub-menu {
  display: none; 
  position: absolute;
  left: 0; /*Данное указание не обязательно*/
}

.nav li:hover > .sub-menu {
  display: block;
  width: max-content;
}

Как выглядит

enter image description here