悬停问题的字体大小增加？答案

【问题标题】：Font size increase on hover problems?悬停问题的字体大小增加？
【发布时间】：2015-03-11 20:10:04
【问题描述】：

我遇到的问题是，当我将鼠标悬停在主页上时，字体大小会增加，但文本会向下移动。我尝试了转换翻译，我尝试做相对位置然后顶部 25px 或其他什么但没有工作。

这是悬停部分：

home:hover{   
    font-size: 25px;

}

这是 HTML 部分：

<nav> |<home> Home </home>| <photos> Photos </photos> | <contact> Contact </contact> | </nav>

这是导航文本的 CSS：

nav{   
    color: #ddfeff;
    font-family: Impact, sans-serif;
    text-align: center;
    padding: 5px 0 5px 0;
    word-spacing: 125px

}

home{
    color: #ddfeff;
    font-family: Impact, sans-serif;
    text-align: center;
    padding: 5px 0 5px 0;
    word-spacing: 125px

}

photos{
    color: #ddfeff;
    font-family: Impact, sans-serif;
    text-align: center;
    padding: 5px 0 5px 0;
    word-spacing: 125px

}

contact{   
    color: #ddfeff;
    font-family: Impact, sans-serif;
    text-align: center;
    padding: 5px 0 5px 0;
    word-spacing: 125px

}

如果您认为需要任何其他脚本，请告诉我。

提前致谢

【问题讨论】：

听起来您正在寻找 line-height: 属性。
@jbutler483 抱歉，我对 HTML / CSS 很陌生，我会如何处理行高？我会把它放在哪里？
w3schools.com/cssref/pr_dim_line-height.asp
@jlowcs 我看了一下之前的，但我真的不明白我会把它放在哪里以及它的价值是什么
老兄，那个页面上甚至还有一个“自己试试”的链接。如果这还不足以让您理解，那我无能为力。

标签： html css text hover

【解决方案1】：

添加一个垂直对齐怎么样？

nav > * {
    vertical-align: middle
}

http://jsfiddle.net/dchkdbvq/

【讨论】：

对我来说似乎还在上下移动，它不是静止不动
文字并没有真正动起来。改变的是容器的高度，因为文本的大小在改变。使用“height”或“line-height”设置固定高度。