css - 在跨度中间显示文本

Question

我想让我的文本 SUN, MON 显示 vertical-align:middle; 但还是不行。目前，文本位于左上角。我的编码有什么问题？我该如何纠正这个问题？

<td colspan="2">
    <span id="selectable">
        <span style="width:35px;height:35px;display:inline-block;" class="ui-widget-content">SUN</span>
        <span style="width:35px;height:35px;display:inline-block;" class="ui-widget-content">MON</span>
    </span>
</td>

感谢您的帮助。

Answer 1

用于在 <span> 内垂直对齐的文本你需要设置 line-height而不是 height :

line-height: 35px;

vertical-align:middle;适用于 table-cell 中的文本元素。它还会影响 inline-block 的垂直定位元素，但不是文本节点。

你可以在这里找到一个很好的解释:http://phrogz.net/css/vertical-align/

更多信息请点击此处:https://developer.mozilla.org/en-US/docs/Web/CSS/vertical-align