Html CSS转换和伪类

使用：after，我尝试创建野蛮主义者伪3D按钮。 但是：after显示在预期元素之上

编辑：很明显，这一转变正在阻碍我们，研究还没有找到原因或解决办法

我错过了什么？还是有更好的办法

nav-li{
位置：相对位置；
显示：内联块；
过渡：背景0.2s；
变换：斜交（10度）；
}
李娜{
显示：块；
文字装饰：无；
填充物：5px10px；
字体：30px/1无衬线；
颜色：#0bf；
}
李海军，主动，
李导航：悬停{
背景：#000；
}
李导航。激活：在{
内容：“；
显示：内联块；
顶部：10px；
左：10px；
宽度：100%；
身高：100%；
背景色：红色；
位置：绝对位置；
z指数：-1；
}

瞧。。。刚刚编辑了这部分：

nav li.active,
nav li:hover{
  background:#000;
}

。。。应该是：

nav li.active a,
nav li:hover a{
  background:#000;
}

以下是工作代码：

nav-li{
位置：相对位置；
显示：内联块；
过渡：背景0.2s；
变换：斜交（10度）；
}
李娜{
显示：块；
文字装饰：无；
填充物：5px10px；
字体：30px/1无衬线；
颜色：#0bf；
}
李海军，主动a，
李导航：悬停a{
背景：#000；
}
李导航。激活：在{
内容：“；
显示：内联块；
顶部：10px；
左：10px；
宽度：100%；
身高：100%；
背景色：红色；
位置：固定；
z指数：-1；
}

而不是

：在
之后，可以使用
框阴影


nav-li{
位置：相对；z指数：0；
显示：内联块；
过渡：背景0.2s；
变换：斜交（10度）；
盒影：10px 10px 0红色；
}
李娜{
显示：块；
文字装饰：无；
填充物：5px10px；
字体：30px/1无衬线；
颜色：#0bf；
}
李海军，主动，
李导航：悬停{
背景：#000；
}





你能解释一下你想做什么吗？听起来很有趣，但你可能需要改进你的问题，以避免否决票和关闭标志。表示伪元素的语法是双冒号-
：
。伪元素是
：：before
和
：：before
@Rounin，虽然这是真的，但浏览器也被正式要求支持单冒号语法。根据“用户代理还必须为这些伪元素接受前一个冒号符号（
：before
和
：after
）。@Rounin我同意。但从实用的角度来看，如果问题是“我的
：after
不起作用”，你就会知道将
：after
更改为
：：after
不会解决问题。太好了！总是一些小事。非常感谢@乔斯