多个行内元素在同一行不用flex垂直居中的几种方式

有几种方法可以在不使用 `flex` 的情况下实现多个行内元素在同一行的垂直居中，以下是其中几种常见的方式：

1. 使用 `vertical-align` 属性：将行内元素的 `vertical-align` 属性设置为 `middle`，可以使其在行内元素所在的行垂直居中。

   <span style="vertical-align: middle;">文本1</span>
   <span style="vertical-align: middle;">文本2</span>

2. 使用 `line-height` 属性：通过设置行内元素的 `line-height` 属性等于容器的高度，可以实现垂直居中。

   <div style="height: 100px; line-height: 100px;">
     <span>文本1</span>
     <span>文本2</span>
   </div>

3. 使用表格布局：将行内元素放置在一个 `<table>` 中，并将表格的 `vertical-align` 属性设置为 `middle`。

   <table style="height: 100px;">
     <tr>
       <td style="vertical-align: middle;">文本1</td>
       <td style="vertical-align: middle;">文本2</td>
     </tr>
   </table>

4. 使用绝对定位和负边距：将行内元素设置为绝对定位，并通过设置负边距来使其垂直居中。

   <div style="position: relative; height: 100px;">
     <span style="position: absolute; top: 50%; transform: translateY(-50%);">
       文本1
     </span>
     <span style="position: absolute; top: 50%; transform: translateY(-50%);">
       文本2
     </span>
   </div>

这些方法可以根据实际需求选择使用，每种方法都有其适用的场景和限制。