分别利用css和Bootstrap实现一个表格，要求有标题和底部的分页信息

首先，我们来看如何使用 CSS 创建一个带有标题和底部分页信息的表格：

HTML 代码：

<div class="table-container">
  <h1>表格标题</h1>
  <table class="table">
    <thead>
      <tr>
        <th>列1</th>
        <th>列2</th>
        <th>列3</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>数据1</td>
        <td>数据2</td>
        <td>数据3</td>
      </tr>
      <tr>
        <td>数据4</td>
        <td>数据5</td>
        <td>数据6</td>
      </tr>
      <tr>
        <td>数据7</td>
        <td>数据8</td>
        <td>数据9</td>
      </tr>
      <!-- 添加更多行 -->
    </tbody>
  </table>
  <div class="pagination">底部分页信息</div>
</div>

CSS 代码：

.table-container {
  margin: 20px;
}

h1 {
  text-align: center;
}

.table {
  width: 100%;
  border-collapse: collapse;
}

th, td {
  border: 1px solid #ddd;
  padding: 8px;
}

th {
  background-color: #f2f2f2;
}

.pagination {
  text-align: center;
  margin-top: 20px;
}

上述代码创建了一个简单的表格，包含一个标题和底部的分页信息。你可以根据实际需要修改表格的内容和样式。

接下来，我们来看如何使用 Bootstrap 来创建一个带有标题和底部分页信息的表格：

HTML 代码：

<div class="container">
  <h1 class="text-center">表格标题</h1>
  <table class="table">
    <thead>
      <tr>
        <th>列1</th>
        <th>列2</th>
        <th>列3</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>数据1</td>
        <td>数据2</td>
        <td>数据3</td>
      </tr>
      <tr>
        <td>数据4</td>
        <td>数据5</td>
        <td>数据6</td>
      </tr>
      <tr>
        <td>数据7</td>
        <td>数据8</td>
        <td>数据9</td>
      </tr>
      <!-- 添加更多行 -->
    </tbody>
  </table>
  <div class="text-center">底部分页信息</div>
</div>

这里我们使用了 Bootstrap 的 CSS 类和样式来创建表格。

希望这些示例能帮助到你！如有任何疑问，请随时提问。