如何修复我的网站导航字体跨页面更改答案

【问题标题】：How can i fix my website navigation font from changing across pages如何修复我的网站导航字体跨页面更改
【发布时间】：2013-10-27 12:34:15
【问题描述】：

我正在网站上做一些工作，但根本无法解决这个问题！由于某种原因，主页导航栏中的字体比网站其他部分的字体小。该网站是使用 wordpress 构建的，我以前从未遇到过这个问题！

我一直在尝试使用 chrome 开发工具来解决这个问题，但到目前为止我还没有找到解决方案。如果有人有时间看一看并可以帮助我解决这个问题，我将非常感激。谢谢

在主页上，您可以看到导航中的字体更小，因此与网站上的任何其他页面相比，位于导航栏的左侧更远：

【问题讨论】：

【解决方案1】：

我认为 % font-size 有问题。

尝试用 px 定义字体大小和行高

style.css（第 903 行）

.builder-module-navigation {
    font-size: 13px;
    line-height: 37px;

    ...
}

【讨论】：

【解决方案2】：

只需删除属性表单.builder-module-navigation li afont-size: 112.5%;

【讨论】：

【解决方案3】：

首先，您的 HTML 无效。不要以div 开头！

你有两个地方有不同的样式表

所以，这将是第一个调查的地方。

在您的情况下，您有一个不同的font-size，尽管在这两种情况下它都被定义为112.5%。来自MDN - font-size

百分比是指父元素的字体大小

这意味着，您必须查看某个祖先的font-size。当你向上层级时，你会发现一种情况是font-size: 100%，另一种情况是font-size: 1em。

要解决您的问题，您可以按照@kkern 的建议在导航栏中使用绝对值重新定义字体大小，或者在两个父级的字体大小中使用相同的值。

【讨论】：