Question

如何为以下Read more超链接实现粗黑边框？我使用了style="border-color: blue important !;"。但它没有用。所以它看起来像是一个粗糙的黑色边框包围着链接。

<!DOCTYPE html>
<html>
<head>
<style>
a:link, a:visited {
    display: block;
    font-weight: bold;
    color: #ffffff;
    background-color: #98bf21;
    width: 120px;
    text-align: center;
    padding: 4px;
    text-decoration: none;
}

a:hover, a:active {
    background-color: #7A991A;
}
</style>
</head>
<body>

<a href="default.asp" target="_blank">Read More</a>

</body>
</html>

Answer 1

应该是：

style="border: 3px solid black;"

Answer 2

只需添加

style="border: 2px solid blue;"

你也可以这样做

style="border: 2px solid blue!important;"

Answer 3

您的代码没有任何厚度规格重构你的代码＆amp;试试这个

//px indicates the thickness of the border
a {
  border: 3px solid black;
}

Answer 4

您忘了设置边框宽度和边框样式：

a {
  /* border: 5px solid black; */
  border-width: 5px;
  border-style: solid;
  border-color: black;

  padding: 2px 5px;
  text-decoration: none;
}

<a href="#">LINK</a>

Answer 5

请参阅以下代码：

<!DOCTYPE html>
    <html>
    <head>
     <style>
        a:link, a:visited {
        display: block;
        font-weight: bold;
        color: #ffffff;
        background-color: #98bf21;
        width: 120px;
        text-align: center;
        padding: 5px;

        }
      a{
       border-style: solid;
        border-width: 5px;
        border-color:black;
    }

        a:hover, a:active {
        background-color: #7A991A;
        }
        </style>
        <a href="default.asp" target="_blank">Read More</a>
    </body>
    </html>

如何在超链接上制作厚黑色边框？

5 个答案: