使用html和css的按钮效果

我想要的是将链接规则应用于此按钮，例如：link、a:hover等，但我不想使用标记，因为它将更改页面上的所有链接。有人能帮我吗

这是我的HTML：

---

首先，将

a

元素包含在

按钮

元素中是无效的

你可以做的是给你的

一个
元素和样式：

<a href="#" role="button"></a>

寻找？这几乎是可能的，除了
a:visted
功能，它很难用纯CSS来模仿。@KingKing，甚至可以模仿吗？@W.D.我认为使用脚本是可能的
a:visited
是一个非常特殊的功能，即使您几天前访问的链接也会被
a:visited
设置样式，很难模仿。某个地方有一些缓存存储了访问过的地址，因此我们必须以类似的方式进行…@KingKing大多数浏览器不披露这些信息，以防止网站窥探用户访问过哪些网站。OP明确表示，他不想使用
标签。否则，我们总是设置
a
标记的样式，使其看起来像一个按钮。@KingKing OP表示，他不想使用
a
标记，因为它会更改页面上的所有链接。这就是为什么在我上面的例子中，我添加了按钮
角色
，以便区分这些链接和其他链接。啊，我理解他的意思。如果是这样，我们总是可以添加
class
。@KingKing如果OP希望
a
元素呈现为按钮，那么设置WAI-ARIA
角色
属性在语义上比添加
类
更正确。但是，如果OP希望处理IE7或更老的浏览器（由于CSS3选择器），则必须使用类。那么不同类型的按钮呢？例如，圆形按钮，圆形按钮。。。
role
属性是否可以使其语义与
class
相同？不管怎样，这只是个人意见的问题。你可以使用
角色
，但如果是我，我会使用
类
。
   button {
    color: #003739;
    background-color: #00bb89;
    padding: 6px 18px;
    border-radius: 100px;
    border: 2px solid #007e5c;
    background: linear-gradient(#00dda1, #00956d);
    box-shadow: inset 0 0 2px white;
    text-shadow: 0px 1px 1px white;
    box-shadow: 0px 2px 5px #d0d0d0;
    cursor: pointer;
}

<a href="#" role="button"></a>