span在div中垂直居中

要在`<div>`元素中将`<span>`元素垂直居中，可以使用以下方法之一：

1. 使用 Flexbox（弹性布局）：

<style>
  .container {
    display: flex;
    align-items: center;
  }
</style>

<div class="container">
  <span>文本内容</span>
</div>

2. 使用表格布局：

<style>
  .container {
    display: table;
    height: 100%;
  }
  
  .cell {
    display: table-cell;
    vertical-align: middle;
  }
</style>

<div class="container">
  <div class="cell">
    <span>文本内容</span>
  </div>
</div>

3. 使用绝对定位和 transform 属性：

<style>
  .container {
    position: relative;
    height: 100%;
  }
  
  .centered-span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
</style>

<div class="container">
  <span class="centered-span">文本内容</span>
</div>

这些方法都可以将 `<span>` 元素垂直居中于包含它的 `<div>` 元素中。你可以根据具体的需求选择其中一种方法。