如何用Bootstrap v5.3实现含多行详情的自定义下拉选择器？

• Bootstrap 5.3的原生<select>组件不支持在<option>标签内渲染多行内容，浏览器原生<option>会忽略所有HTML标签（比如你用的<br>），所有内容都会被解析为单行文本。
• Bootstrap官方没有内置带多行详情的下拉选择器组件，仅靠原生Bootstrap表单组件无法直接实现你要的效果。
• 你需要自定义选择器，或者用Bootstrap的下拉菜单（Dropdown）组件来模拟：
  • 用Dropdown组件替代原生select，每个下拉项用<div>或其他块级标签包裹，就能自由添加多行内容、自定义样式；
  • 自行处理选中状态的展示、选中值的存储逻辑。

简单实现示例：

<div class="dropdown">
  <button class="btn btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
    选择选项
  </button>
  <ul class="dropdown-menu">
    <li>
      <div class="dropdown-item py-2">
        <span>Option 1</span><br>
        <small class="text-muted">Created At: 2024-05-20</small>
      </div>
    </li>
    <li>
      <div class="dropdown-item py-2">
        <span>Option 2</span><br>
        <small class="text-muted">Created At: 2024-05-21</small>
      </div>
    </li>
  </ul>
</div>

内容的提问来源于stack exchange，提问作者LogicalDeveloper