Question

我有一个关于按钮的纯CSS（显示）解决方案：

<span class="follow-status following">
    <a href="#" class="btn btn-follow" data-user-id="123">
        <span class="following-text"><i class="icon-ok"></i> Following</span>
        <span class="follow-text"><i class="icon-plus"></i> Follow</span>
        <span class="unfollow-text"><i class="icon-remove"></i> Unfollow</span>
    </a>
</span>

例如，我想根据显示的内容更改悬停时的文字。然而，a元素具有填充，并且样式化跨度看起来非常笨拙。 - 我应该覆盖A填充并将其移入跨度吗？ - 我应该以不同的方式编写HTML吗？ - 我应该只通过JS切换适用的文字/风格吗？ - 别的什么？

你可以看到外跨区有“跟随”类

.follow-status span { display:none }
.following .following-text { display: block}
.following:hover .following-text { display: none}
.following:hover .unfollow-text { display: block}

你如何在twitter引导程序范围内完成它？

Answer 1

就个人而言，我会从锚点内的跨距中删除所有填充/边距，并将CSS填充/边距等应用于锚元素。这样你将来证明自己想要在锚元素中添加不同的元素。

在Twitter引导程序中更改悬停样式？

1 个答案: