Html 如何在Bootstrap4下拉菜单中应用网格系统，使其形状像附加的图像？

我想创建下拉菜单，如图所示，用红色边框突出显示

附加的屏幕截图来自此（引导主题）

我试图应用bootstrap flex实用程序，但无法完成，我如何才能实现这一点

---

我想当你看到你提到的网站上的代码时，你会有所收获。类

下拉菜单

的

宽度

属性为

420px

，显示时的

flex wrap

属性值为

wrap

。然后该div中的所有项都有一个类

下拉项

，其

宽度

属性设置为

33,33%

。这样，所有项目都是1/3，得到3行。我想就这些了

<div class="dropdown-menu" aria-labelledby="themes">
  <a class="dropdown-item" href="../default/">Default</a>
  <a class="dropdown-item" href="../united/">United</a>
  <a class="dropdown-item" href="../yeti/">Yeti</a>
</div>

.dropdown-menu.show {
  display: flex;
  width: 420px;
  flex-wrap: wrap;
}

.dropdown-item {
  width: 33,33%;
}

.下拉菜单.show{
显示器：flex；
宽度：420px；
柔性包装：包装；
}
.下拉项{
宽度：33,33%；
}

像这样的。当我在网站上看到我喜欢的东西时，我总是去找检查员看看它是怎么做的