如何使用bootstrap table在表头的同一行上获得四个图标？

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-table@1.20.0/dist/bootstrap-table.min.css">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap-table@1.20.0/dist/bootstrap-table.min.js"></script>

<table id="myTable" data-toggle="table" data-toolbar="#toolbar">
  <thead>
    <tr>
      <th data-field="id">ID</th>
      <th data-field="name">Name</th>
      <th data-field="price">Price</th>
      <th data-field="actions">Actions</th>
    </tr>
  </thead>
  <tbody>
    <!-- 表格内容 -->
  </tbody>
</table>

<th data-field="actions">
  <i class="bi bi-pencil"></i>
  <i class="bi bi-trash"></i>
  <i class="bi bi-eye"></i>
  <i class="bi bi-download"></i>
</th>

$(function() {
  $('#myTable').bootstrapTable({
    // 配置选项
  });
});