Html 你们将如何处理这个问题，将鼠标悬停在导航栏中的文本上，增加所有内容之间的空间

正如你们所看到的，因为导航栏中有一个空格，当我增加字体大小时，它会将所有内容向左或向右推。有没有办法在边距之间添加空白或其他内容，这样它就可以自由地使用额外的空间，而无需根据我悬停的内容向左或向右移动

@仅媒体屏幕和（最小宽度：1920像素）{
身体{
背景色：#F0F2F5；
宽度：1920像素；
高度：800px；
}
}
#JGLogo{
位置：相对位置；
顶部：8px；
左：-250px；
}
NavBar先生{
边缘顶部：15px；
文本对齐：居中；
宽度：100%；
身高：10%；
背景色：白色；
边框底部：1px实心#e3ff；
}
纳瓦尔先生{
位置：相对位置；
顶部：-15px；
右边距：55px；
字体大小：32px；
颜色：#62ACFF；
文字装饰：无；
}
.导航栏a:悬停{
字体大小：36px；
}

杰加达姆

首先，如上所述，

头标签不应包含任何标记。必须将标记放在
正文
标记中

我将通过为标记
a:hover
使用规则
transform:scale（）
来解决这个问题。像这样：

.NavBar a:hover {
    transform: scale(1.1);
}

此外，您应该为标记
a
设置以下规则：

.NavBar a {
    ...
    transition: .5s;
    display: inline-block;   
    ...
}


#JGLogo{
位置：相对位置；
顶部：8px；
左：-250px；
}
NavBar先生{
边缘顶部：15px；
文本对齐：居中；
宽度：100%；
身高：10%；
背景色：白色；
边框底部：1px实心#e3ff；
}
纳瓦尔先生{
位置：相对位置；
顶部：-15px；
右边距：55px；
过渡：.5s；
显示：内联块；
字体大小：32px；
颜色：#62ACFF；
文字装饰：无；
}
.导航栏a:悬停{
/*字体大小：36px*/
转换：比例（1.1）；
}
@仅介质屏幕和（最小宽度：1920像素）{
身体{
背景色：#F0F2F5；
宽度：1920像素；
高度：800px；
}
}

杰加达姆
文档中有您的内容
——这可能不是问题的根源，但肯定是不正确的。可能值得注意的是，
不应该包含任何标记，除了
脚本
s、
链接
s和其他元数据…@AlexanderNied，是的，我没有注意。修正了这个问题。谢谢大家的提醒，我把所有的东西都移到了身体上，除了剧本和标题之外，我不会在脑子里放任何东西。这似乎是一种转变：scale什么都没做。也许我必须将位置设置为绝对或其他什么？@Jake，您还需要添加
display:inline block和
转换：.5s至
。导航栏a
。请看我的最新答案。是的，我看到了，所以我解决了这个问题。我从NAVBAR类中删除了边距，因此我的徽标没有采用边距属性。所以现在我的徽标在动画中不会向左移动。还有一个简单的问题，我在谷歌搜索了很多次，但似乎找不到一个关于我应该如何定位（以专业的方式）的答案。我假设的位置是：相对的，以百分比为基础的位置是最好的方法？与绝对像素和特定像素相比，对吗？