Question

＆＃13;

  @import url(https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|PT+Sans+Narrow|Poiret+One|Josefin+Sans);
    
    #header {
      background-color: #16a085;
      width: 100%;
      height: 15%;
    }
    
    #mid {
      width: 100%;
      height: 70%;
      background-color: #FFFFD0;
    }
    
    #foot {
      background-color: #16a085;
      width: 100%;
      height: 15%;
    }
    
    .menubar {
      display: inline-block;
      padding-top: 2%;
      font-family: Poiret One;
      font-size: 30px;
      font-weight: bold;
    }
    
    .menudiv {
      display: inline-block;
      width: 200px;
    }
    
    #invisdiv {
      width: 30%;
      display: inline-block;
    }
    
    html, body {
    margin:0;
    padding:0;
    }
    
    a:link {
      color: black;
      text-decoration: none;
    }

＆＃13;

        <!DOCTYPE html>
    <html>
    <head>
    <title>beager.xyz</title>
    <link type="text/css" rel="stylesheet" href="css/style.css"/>
    </head>
      <body>
        <div id="header">
           <div id="invisdiv"></div>
          <a href="index.html"><p class="menubar" id="homebutton">Home</p></a>
                           <div class="menudiv"></div>
          <a href="resume"><p class="menubar">Résumé</p></a>
           <div class="menudiv"></div>
          <a href="contact"><p class="menubar">Contact Me</p></a>
        </div>
        
        <div id="mid"></div>
        
        <div id="foot"></div>
    </body>
    </html>

＆＃13;

我希望顶部的三个链接是黑色而不是蓝色，我已经尝试了很长时间。它可能是一些愚蠢的东西，但我仍然是HTML和CSS的新手。感谢。

我的代码在您的上方。我的网站将成为我发送给雇主的个人网站。再次感谢。

Answer 1

因为，在测试代码时，您已经访问了要链接的页面。

:link伪类仅匹配未访问的链接。

删除它，或者编写另一个匹配:visited的选择器。

Answer 2

在JSFiddle中测试时链接是黑色的。但是，你可以删除：链接，不是必需的。只需使用a { color: black; }

即可

CSS / HTML - 为什么我的链接变黑了？

2 个答案: