为链接尝试不同的伪类？答案

【问题标题】：Trying different pseudo-classes for links?为链接尝试不同的伪类？
【发布时间】：2018-12-23 13:58:41
【问题描述】：

我是编码新手，我遇到了一个看似简单但无法解决的问题。

我有一个按钮格式的链接，现在我文档中的所有链接都显示为一个按钮。

.button {
    font-size: 12px;
    font-family:  'Montserrat', sans-serif;
    text-align: left;
}
a:link, a:visited {
    background-color: rgb(55, 89, 238);
    color: white;
    padding: 10px 16px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    border-radius: 30px;
}

<div class="button">
        <a href="emailto:my@mail.com">Contact me</a>
    </div>
    <div>
    <p>Now I want to add a normal link but it looks like
<a href="page.php">a button</a></p>
</div>

编辑：我想知道如何使我网站中的其他链接看起来正常？

【问题讨论】：

您好，您能详细解释一下您的问题吗？
:link CSS 伪类表示尚未访问的元素。它匹配每个未访问的

标签： html css button pseudo-class

【解决方案1】：

您需要使用一个 css 后代选择器，该选择器将包括按钮和仅针对该“按钮链接”的链接，这将保留所有其他链接。当您使用 .button 和 a:link 之间只有一个空格时，它会一起查找它们两者，并认为它们像后代一样相关。以下是如何执行此操作：

.button {
    font-size: 12px;
    font-family:  'Montserrat', sans-serif;
    text-align: left;
}
.button a:link, .button a:visited {
    background-color: rgb(55, 89, 238);
    color: white;
    padding: 10px 16px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    border-radius: 30px;
}

<div class="button">
        <a href="emailto:my@mail.com">Contact me</a>
    </div>
    <div>
    <p>Now I want to add a normal link but it looks like
<a href="page.php">a button</a></p>
</div>

【讨论】：

【解决方案2】：

在您的 css 中，您将样式应用于您在 HTML 中的 all a

为了防止它你必须通过添加class或id属性来spesific那些button或a并在css中为他们设置样式（对于班级，您必须在 css 中的班级名称之前添加 . (.className)，对于 id # (#idName))：

在这里了解css中的选择器：https://www.w3schools.com/cssref/css_selectors.asp

.button{
    font-size: 12px;
    font-family:  'Montserrat', sans-serif;
    text-align: left;
}
.spesificA:link, .spesificA:visited {
    background-color: rgb(55, 89, 238);
    color: white;
    padding: 10px 16px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    border-radius: 30px;
}

<div class="button">
        <a href="emailto:my@mail.com" class="spesificA">Contact me</a>
    </div>
    <div>
    <p>Now I want to add a normal link but it looks like
<a href="page.php">a button not spesific class(without style)</a></p>
</div>

【讨论】：

告诉我以获得更多帮助！