html - 与导航下拉菜单相关的问题

Question

我正在创建模板并在调整页眉时遇到问题。一切都快完成了，但标题显示了问题。问题是当将鼠标悬停在菜单上时，它显示一切正常，但将鼠标悬停在具有下拉菜单的任何导航项上时，它会减小下一项的字体大小。

我也尝试过创建一个新的标题，但只有在有下拉菜单时才会遇到同样的问题。

您可以在 http://html.daatcreations.com/mobeva/ 查看代码

Answer 1

您看到的伪影不是字体大小的变化，它是由 rotateX 变换引起的。浏览器正在为围绕 X 轴旋转的下拉列表的边缘腾出空间，以便您可以看到边缘。

很难诊断，但很容易修复。您需要在正在旋转或为旋转元素的边缘腾出空间的元素上将 backface-visibility 属性设置为 hidden。

.dropdown {
    backface-visibility: hidden;
}