我正在尝试使用<span>在我的导航栏中移动一些文本。我的导航栏是 a<ul>并且元素都是<li>s 但文本与导航栏的顶部对齐，我希望它垂直居中。正如您在 JSFiddle 中看到的那样，我在 CSS 中使用 a:hover 属性来更改文本悬停时的背景和颜色。当我将跨度仅应用于文本时，整个悬停部分也会移动。看看你能不能明白我的意思。
我的 JSFiddle 在这里：
基本上我只希望文本以一种简单、简洁的方式垂直对齐。最初我使用''标签并在它们上设置边距，但我想避免为此目的使用标题标签以改进 SEO。谢谢。
添加 line-height:40px 以使文本垂直居中。IE7 会遇到问题，因为它没有得到完全支持，因此 li 上带有 padding-top 的条件样式表将解决它。
添加行高有效，您还可以在顶部添加填充：
.class { padding-top: 10px; }
将填充调整到中心。
几年后更新它，但总是可以选择使用：
display:table;
display:table-row;
display:table-cell;
垂直对齐：中间；为了使项目居中。这些天我更喜欢这种方法，因为您可以将响应规则应用于显示样式（例如，如果您需要针对其他屏幕尺寸对其进行更新，请将其更改为 display:block 和 display:inline-block 等。这是一个小提琴：