Html 更改悬停效果的高度

我的悬停效果与导航栏不完全一致。事实上，它们有点宽，我想修正一下。我试过一些东西，但没有成功

现在的情况是这样的：

代码：

正文{
背景图像：线性渐变（rgba（0,0,0,0.3），rgba（0,0,0,0.3）），url（'img/tape measure.jpg'）；
背景尺寸：封面；
高度：1000px；
颜色：#000305；
字体大小：100%；
字体系列：“即将推出”，“Lucida Sans Unicode”，草书；
线高：1.5；
}
a{
文字装饰：无；
}
a:链接，a:已访问{
颜色：#CF5C3F；
}
a:悬停，a:活动{
背景色：#CF5C3F；
颜色：#fff；
}
.main标题{
宽度：90%；
保证金：0自动；
}
.main标题图像标志{
位置：绝对位置；
右：5%；
最高：54%；
宽度：15%；
高度：自动；
}
.mainHeader img.Margrit{
位置：绝对位置；
右：5%；
最高：15%；
宽度：15%；
高度：自动；
}
.main标题导航{
背景色：#9cb34f；
边界半径：5px；
-moz边界半径：5px；
-webkit边界半径：5px；
}
.mainHeader导航ul{
列表样式：无；
溢出：自动；
}
.main头导航ul li{
文本对齐：居中；
浮动：左；
宽度：24%；
}
.mainHeader导航a:链接，.mainHeader导航a:已访问{
颜色：#fff；
背景色：#CF5C3F；
}
.mainHeader导航a:悬停，mainHeader导航。活动a:已访问{
背景色：#CF5C3F；
文本阴影：无；
}
.main标题导航ul li a{
边界半径：5px；
-moz边界半径：5px；
-webkit边界半径：5px；
显示：内联块；
高度：30px；
填充：10px 130px；
}
.mainp{
}
.mainHeader p.InbearBeitong{
位置：绝对位置；
最高：45%；
左：5%；
字体大小：150%；
颜色：#CF5C3F；
字体大小：200%；
}
.mainfoter{
位置：绝对位置；
底部：3%；
宽度：90%；
左：5%；
右：5%；
高度：30px；
边界半径：5px；
-moz边界半径：5px；
-webkit边界半径：5px；
背景色：#9cb34f；
显示：表格；
}
.mainpooter{
颜色：#fff；
显示：表格单元格；
垂直对齐：中间对齐；
左：1%；
}

安尼时装






这座城市位于比尔贝东。
比尔贝东

版权所有（

我认为您遇到了这个问题，因为一些元素的高度，如

和
小于
您的a[tag]需要内联块显示的高度；然后再加上高度=20px；（您的菜单高度）

导致这种情况的不是悬停规则，而是
nav
规则中对
高度的限制。从
nav
中删除
height
设置，并添加
overflow:auto到
ul
（将
ul
环绕浮动的
li
s）


正文{
背景图像：线性渐变（rgba（0,0,0,0.3），rgba（0,0,0,0.3）），url（'img/tape measure.jpg'）；
背景尺寸：封面；
高度：1000px；
颜色：#000305；
字体大小：100%；
字体系列：“即将推出”，“Lucida Sans Unicode”，草书；
线高：1.5；
}
a{
文字装饰：无；
}
答：林克，
a:参观了{
颜色：#CF5C3F；
}
a:悬停，
a:主动的{
背景色：#CF5C3F；
颜色：#fff；
}
.main标题{
宽度：90%；
保证金：0自动；
}
.main标题图像标志{
位置：绝对位置；
右：5%；
最高：59%；
宽度：15%；
高度：自动；
}
.mainHeader img.Margrit{
位置：绝对位置；
右：5%；
最高：15%；
宽度：15%；
高度：自动；
}
.main标题导航{
背景色：#9cb34f；
边界半径：5px；
-moz边界半径：5px；
-webkit边界半径：5px；
}
.mainHeader导航ul{
列表样式：无；
溢出：自动；
}
.main头导航ul li{
文本对齐：居中；
显示：内联块；
浮动：左；
宽度：24%；
}
.main标题导航a:链接，
.mainHeader导航a：已访问{
颜色：#fff；
}
.mainHeader导航a：悬停，
主标题导航激活a：已访问{
背景色：#CF5C3F；
文本阴影：无；
}
.main标题导航ul li a{
边界半径：5px；
-moz边界半径：5px；
-webkit边界半径：5px；
}

安尼时装






这座城市位于比尔贝东。
比尔贝东

版权所有（

那么，如果25px是链接的高度，我可以将其更改为20px吗？如果我将导航条设置为25px，它可以工作，但我希望链接为20px，正如我在上面添加的图片中所示，有些地方不正确。我还编辑了代码。最新图片下面描述了这个问题
.mainHeader nav ul li a {
  display: inline-block;
  height: 20px;
}