Question

嘿，我正试图让这个导航工作得很好：

我无法弄清楚为什么“当前”标签的背景图片会延伸到链接的范围之后。它不会在其他状态（正常和悬停）上执行此操作 - 我已经在这些状态上使用不同的图像对其进行了测试，因为如果没有选项卡，您无法真正说出来。

这让我很生气，因为该技术可以在活动和悬停时使用，但不适用于“当前”项目上的特殊类。非常感谢帮助！感谢〜

Answer 1

我不确定你认为背景图像是否不延伸到跨度之后。 span标记位于锚元素内部，如下所示：

+-----------+
|    +-----+|
|    |     ||
|    +-----+|
+-----------+

span标记不会像这样延伸到锚标记之外：

+--------+
|    +------+
|    |      |
|    +------+
+--------+

它在所有状态下都是一样的，区别在于对于普通状态和悬停状态，没有透明部分的跨度背景可以看到锚背景（除非你仔细看阴影）。 / p>

解决方案是不要在背景图像上使用透明度。使它坚固，看起来像背景上的阴影。

这也将解决双影的问题。如果仔细观察，您会注意到span标记中背景图像的阴影被添加到锚标记中背景图像的阴影中，从而导致它们重叠的阴影。在选项卡的最左侧，您只有锚标记的背景，阴影更亮。双阴影效果在所有选项卡上，但对于正常和悬停状态，它是如此微妙，你必须知道它是在那里看到它。