0

我有一个用于关注按钮的纯 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 元素有填充，并且样式化 span 看起来真的很尴尬。- 我应该覆盖 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 引导程序范围内实现这一点？

4

1 回答 1

1

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

于 2013-01-06T23:46:05.190 回答