在下面的示例中,我正在使用字体为导航创建图标: http://www.blackcountrydesigns.co.uk/examples/green/ 我遇到的问题是,当您将鼠标悬停在链接上时,链接和图标上都有一个下划线。 我想知道如何删除图标上的下划线,但将其保留在链接上。 这是我的代码: 的HTML
到目前为止,我发现从生成的内容中删除(通常)继承的样式的唯一方法是使用简化的演示(从注释中)将其位置设置为绝对: 一条链接 { 文字修饰:无; 职位:相对 左边距:1em; } 悬停 { 文字装饰:下划线; } 答:之前 { 内容:“#”; 位置:绝对; 正确:100%; 最高:0; 底部:0 宽度:1em; } JS Fiddle演示。 当然,此方法的缺点是要求将明确的宽度分配给生成的内容(并在父元素的边缘分配一个元素)。 | 一种替代方法是将链接的文本包装在一个元素中,例如跨度,请从“ a”中删除下划线,并将其应用于悬停时的跨度。