超链接颜色添加或修改方法

目录展开

给超链接添加颜色是将它们与常规文本区分开的好方法。MAY的SEO博客将为您分享使用十六进制颜色代码、RGB和HSL值以及HTML颜色名称来增添或修改超链接颜色。

1. 超链接颜色使用十六进制颜色代码

首先，我们将使用十六进制颜色代码，这可能是向链接添加颜色的最常见方法。在HTML的a标记中，href属性之后，插入一个style属性，并将color属性设置为您的十六进制颜色代码（如本例中为＃FF0000）。

<body>
  <a href="http://example.com/" style="color: #FF0000;">Red Link</a>
</body>

超链接颜色添加或修改的第二种方法是使用RGB值。将值放在rgb（）中，使它们像十六进制代码一样在网页内使用。

<body>
  <a href="http://example.com/" style="color: rgb(255,0,0);">Red Link</a>
</body>

使用RGB值的另一个优点是可以控制颜色的不透明度。用rgba（）替换rgb（），然后可以在0和1之间指定第四个值（0表示完全透明，1表示完全不透明）。

<body>
  <a href="http://example.com/" style="color: rgba(255,0,0,0.5);">Red Link</a>
</body>

HSL代表色相、饱和度和亮度，是大多数现代浏览器（IE9 +）支持的另一组颜色值。与RGB一样，您可以将HSL值放在HSL（）中，然后在网页中使用它们，如下所示。

<body>
  <a href="http://example.com/" style="color: hsl(0,100%,50%);">Red Link</a>
</body>

HSL还支持Alpha通道，并采用与RGB相同的格式。使用hsla（）而不是hsl（），并为不透明度添加介于0和1之间的第四个值。

<body>
  <a href="http://example.com/" style="color: hsla(0,100%,50%,0.5);">Red Link</a>
</body>

超链接颜色使用HTML颜色名称会使您的代码看起来非常清晰。

<body>
  <a href="http://example.com/" style="color: red;">Red Link</a>
</body>

使用上面的4种方法来控制整个网站上的所有超链接颜色，以改善网站的外观！