Question

我已经仔细检查了管子，试图找到一种方法来做到这一点，但我只是想添加一个＆gt;滚动时，我的链接大于号。我不想使用图像，我正在尝试避免使用桌子等等。看，我正在做前端，我是一个后端人。所以我理解这些概念，不要将它们付诸实践。

以下是代码，不确定它是否有很大帮助。

<ul>
    <li><a href="#">About Us</a></li>

和css

li a:hover {
    font-size: 12px;
    text-transform: uppercase;
    color: #FC3;
    padding-left: 15px;
    height: 1px;
    width: 1px;
    border: thin solid #fff;
    padding-top: 10px;
    padding-right: 15px;
    padding-bottom: 10px;
}

我知道，它并不漂亮，而且我今天要做的事情清单上用CSS进行霰弹枪婚礼的想法并不高。任何帮助将不胜感激。

我基本上想要它说“关于我们＆gt;”，当它盘旋时。

Answer 1

可能是最简单的跨浏览器解决方案：

<a href="#">About Us <span class="showme">&gt;</span></a>

....

li a span.showme { display: none }

li a:hover span.showme { display: block }

如果您不希望链接在悬停时更改其大小，请使用visibility: hidden / visible代替display。

Answer 2

li a:hover {
    font-size: 12px;
    text-transform: uppercase;
    color: #FC3;
    padding-left:15px;
    height: 1px;
    width: 1px;
    border: thin solid #fff;
    padding-top: 10px;
    padding-right: 15px;
    padding-bottom: 10px;
}
li a:hover:after {
    content: " &gt;";
}

应该做的伎俩。

将文本附加到Rollover上的链接

2 个答案: