2

如何使按钮看起来像锚标签？

我尝试了下面的 HTML，但是当我将鼠标悬停在按钮上时，底部边框看起来与其他锚标记不同。边框底部看起来在文本下方大约 3px，而在锚标签上，它们之间只有 1px。

我只会使用一个链接，但我已经读过一个按钮在我的情况下在语义上会更正确。

<style>
.epUnsubscribe {
    float: left;
}

    .epUnsubscribe button {
        background: none!important;
        border: none;
        padding: 0!important;
        cursor: pointer;
        border-bottom: 1px solid #ffffff;
        color: #5C8C9B;
    }

        .epUnsubscribe button:hover {
            border-bottom: 1px solid #5C8C9B;
        }
</style>

<div style="float: left" class="epUnsubscribe">
        <button id="BtnUnsubscribe">Unsubscribe</button>
    </div>
4

3 回答 3

4

它不是超链接的边界，而是下划线，试试这个：

.epUnsubscribe button:hover {
  border: none;
  text-decoration: underline;
}
于 2012-10-29T14:18:55.693 回答
0

使用实际链接并使用onclick="..."回调为其提供一些按钮功能可能会更容易。

于 2012-10-29T14:18:07.637 回答
-1

链接没有底部边框，它们有下划线

text-decoration:underline
于 2012-10-29T14:20:45.387 回答