最近，我创建了一个导航栏，并使用-webkit-transform:skew(-30deg);和tweaks of the community将菜单项转换为平行四边形。
现在，我尝试使用CSS类.submenu修复下拉菜单。
这是我目前的进展：http://jsfiddle.net/an5mb2y3/1/
但是有一些我无法解决的错误：
字体平滑：当我将鼠标悬停在下拉菜单项上时，字体会变得模糊。再过一秒，字体变得清晰。我读到了使用 - webkit-font-smoothing: antialiased来解决这个问题，我尝试过并且没有成功。
此外，下拉菜单显示在嵌入图像后面的背景中。我想在图像的顶层显示菜单。我尝试的是将z-index更改为更大的值。但它不起作用。
我想在悬停时从平行四边形开始的位置显示子菜单。我在margin-left: 42px;课程上尝试.submenu，但这同时对两个下拉菜单都不起作用。
答案 0 :(得分：1)
添加此CSS下拉菜单：
nav.nav-primary{z-index: 1; position: relative;}