css中怎么让数据和标题对齐

在CSS中，如何让数据和标题对齐呢？这是一个很常见的问题，以下是一些解决方案。
1. 使用表格
使用表格可以让数据和标题全部在一行中对齐。可以通过设置表格的边框、间距、单元格宽度等属性来控制表格的样式。
例如：

 <table>
    <tr>
      <th>姓名</th>
      <th>年龄</th>
      <th>性别</th>
    </tr>
    <tr>
      <td>张三</td>
      <td>18</td>
      <td>男</td>
    </tr>
    <tr>
      <td>李四</td>
      <td>20</td>
      <td>女</td>
    </tr>
  </table> 

2. 使用flex布局
使用flex布局可以让数据和标题在一行中自适应对齐。可以设置容器为flex布局，并设置每个子元素的flex-grow、flex-shrink、flex-basis等属性来控制子元素在容器中的比例和大小。
例如：

 <div class="container">
    <div class="item">姓名</div>
    <div class="item">年龄</div>
    <div class="item">性别</div>
  </div>
  
  <style>
    .container {
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    .item {
      flex: 1;
      text-align: center;
    }
  </style> 

3. 使用浮动
使用浮动可以让数据和标题在一行中左对齐。可以设置标题的宽度和浮动方向，并设置数据的margin-left属性来控制数据在标题后的位置。
例如：

 <div class="container">
    <div class="title" style="float: left; width: 100px;">姓名</div>
    <div class="data" style="margin-left: 100px;">张三</div>
  </div>
  
  <style>
    .container {
      overflow: hidden;
    }
    .title {
      font-weight: bold;
    }
  </style> 

以上就是CSS中让数据和标题对齐的几种方法，可以根据具体需求选择合适的方式来实现。