ساخت زیر منو

درود خوبی...
پیوند زیر:
https://codepen.io/emredenx/pen/MWzBxK

سلام
فرض کنید این منوی شما باشه:

<nav>
<div class="dropdown">
<span>فروشگاه</span>
<ul id="dropdown-content">
<li>خودرو</li>
<li>موتور سیکلت</li>
</ul>
</div>
</nav>

ابتدا یک nav گذاشتیم که قراره کل منوی ما و آیتم‌های دیگری که شما می‌خواهید داخل منویتان قرار بگیرد آنجا باشد.
بعد از آن یکی از آیتم‌های آن که فرمودید فروشگاه هستش رو به حالتی که اول یک div اصلی باشد و بعد داخل span متن «فروشگاه» قرار بیگرد. داخل همان div و بعد از span یک تگ ul تعریف می‌کنیم تا به قول شما زیر منوهایمان را آنجا قرار بدهیم.

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  padding: 12px 16px;
  z-index: 1;
}

.dropdown:hover .dropdown-content {
  display: block;
}

این هم کد css. طبیعتا در ابتدا باید به dropdown استایل مد نظر خودمون رو بدیم. در ادامه dropdown-content استایل بهش میدیم و display اش هم برابر none می‌کنیم. حالا قراره هر وقت کاربر روی dropdown ما موسش رو آورد display عنصر dropdown-content رو باید برابر block کنیم تا نمایش داده بشه