将样式添加到活动链接？

-1

嗨在我的网站website（密码：ebriff）我已经添加了小白色三角形作为图片到活动链接。但因为我有一张图片作为我的第一个菜单链接，所以不会添加到该图片中。我如何解决这个问题？将样式添加到活动链接？

CSS：

.top-menu li{ 
    margin: 0; 
    float: left; 
    font-family: 'Oswald', sans-serif; 
    text-transform: uppercase; 
    color: #fff; /* text color */ 
    font-size: 15px; 
    text-shadow: 0 1px 0 rgba(0,0,1,.5); /* drop shadow */ 
    letter-spacing: 1px; 
    font-weight: 300; 
    } 

li.top { 
    border-right: 1px solid #007472; 
    border-left: 1px solid #009C9A; 
} 

li.top:last-child { 
    border-right: none; 
} 

li.top:first-child { 
    width: 70px; 
    border-left: none; 
    background: url({{'home-icon.png'|asset_url}}) no-repeat 24px 25px; 
    text-indent: -9999px; 
} 

.current { 
    background: url({{'triangle.png'|asset_url}}) no-repeat center bottom} 
}

来源

2013-03-20 McKeene

这将是巨大的，如果你能告诉我们你的HTML了。 – Steve 2013-03-20 22:13:05

嗯......你确定在这个你不拥有或控制的公开网站中包含密码是安全的吗？ – 2013-03-20 22:13:07

如果密码不敏感，并且稍后您将更改该密码，则该链接将会失效并且该问题将来无法使用。 – 2013-03-20 22:15:48

你可以把家里图标，背景图片的链接，而不是列表项。至少这为我工作，当我在Chrome开发者工具试了一下;）的所以不是

li.top:first-child { 
    width: 70px; 
    border-left: none; 
    background: url({{'home-icon.png'|asset_url}}) no-repeat 24px 25px; 
    text-indent: -9999px; 
}

使用

li.top:first-child { 
    width: 70px; 
    border-left: none; 
    text-indent: -9999px; 
} 
li.top:first-child a{ 
    background: url({{'home-icon.png'|asset_url}}) no-repeat 24px 25px; 
}

来源

2013-03-20 22:25:23 user1950929

您可以使用CSS3多背景

background: url(...), url(...);

，或者您可以手动创建带箭头的图像叠加在“正常的背景图标”，并用它为：活跃选择。也考虑使用CSS sprites。

在多个背景：http://www.css3.info/preview/multiple-backgrounds/

来源

2013-03-20 22:18:24

我试着添加这个： .current {0121} {{'home-icon.png'| asset_url}}）重复24px 25px，background：url（{{'triangle.png'| asset_url}}）no-repeat center bottom}; } – McKeene 2013-03-20 22:28:04

但后来它停止了所有这些工作。但在同一时间，如果它的工作，主页图标也将被添加到所有不同的链接对吗？ – McKeene 2013-03-20 22:29:12

在你的代码中，第二个后台声明_overwrites_是第一个而不是_adding_。请写：背景：网址（...）无重复24px 25px，网址（...）无重复中心底部; – 2013-03-20 22:32:13

将样式添加到活动链接？

回答

相关问题