29.10. fejezet: Legördülő menü (Dropdown)

Használata igen egyértelmű. Sokfelé és sokan használják, ha több lehetőség van egy weblapon, mint hely (pl. a tetején). Minta:
<div class="dropdown">
  <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">Nyomógomb</button>
  <div class="dropdown-menu">
    <a class="dropdown-item" href="#">1.Link</a>
    <a class="dropdown-item" href="#">2.Link</a>
    <a class="dropdown-item" href="#">3.Link</a>
  </div>
</div>

A felsorolt menük közé el lehet rejteni egy osztó(csíkot) is. Minta:
<div class="dropdown-divider"></div>

Ha nem pont a nyomógomb alatt szeretnénk a menüt legördíteni, akkor balra vagy jobbra is elrakhatjuk. Minta:
<div class="dropdown dropleft">
illetve:
<div class="dropdown dropright">

A menüt lehet felfelé is aktiválni. Minta:
<div class="dropup">

További lehetőségek találhatók az alábbi címen: (tényleg sok!)
https://www.w3schools.com/bootstrap4/bootstrap_dropdowns.asp

Tisztelt felhasználók, olvasók és CSS iránt érdeklődők!

A legfontosabb elemeken immáron túljutottunk, bár tudom, hogy még igen sok értelmes ötlet maradt. Remélem, hogy ez a fordítás, illetve újraértelmezés kedvet csinált a Bootstrap használatához. Sok sikert a hozzá!

Még egyszer a forrás, ahonnan dolgoztam:

https://www.w3schools.com/bootstrap4/default.asp

Köszönettel:

Tamás Ferenc, 2020. nov.