如何在HTML中更改链接的颜色?
链接是指从一个网页到另一个网页的连接。
我们可以在网页中添加页面链接。HTML链接是超链接。<a>标签定义了一个超链接,用于在一个页面之间建立链接。href属性与<a>标签一起使用,指示链接的目标。
要在HTML页面中创建页面链接,请使用<a>和</a>标签,并使用href属性定义链接。我们应该在<body>…</body>标签内使用<a>…</a>标签。
链接文本是可见的。点击链接文本将导航到指定的URL地址。
默认情况下,链接在浏览器网页上的显示如下。
未访问的链接带下划线且为蓝色
已访问的链接带下划线且为紫色
活动的链接带下划线且为红色
语法
以下是创建网页链接的语法。
<a href="https://www.Google.com/"> text of the link </a>
我们可以使用样式表更改链接的颜色。
示例
以下是用CSS更改链接颜色的示例程序。
<!DOCTYPE html> <html> <head> <style> a:link { color: greenyellow; background-color: transparent; text-decoration: none; } a:visited { color: deepskyblue; background-color: transparent; text-decoration: none; } a:active { color: yellow; background-color: transparent; } </style> </head> <body> <a href="https://www.youtube.com/watch?v=qz0aGYrrlhU" >HTML Tutorial</a> </body> </html>
我们已将未访问链接的颜色更改为绿黄色。
我们已将已访问链接的颜色更改为深空蓝,活动链接的颜色更改为黄色。
示例
以下是另一个使用CSS更改链接颜色的示例程序。
<!DOCTYPE html> <html> <head> <title>HTML Link Color</title> </head> <body> <h2>About</h2> <p> Our <a href="/about/about_team.htm" style="color: red">Team</a> comprises of programmers, writers, and analysts. </p> </body> </html>
示例
以下是用CSS更改链接颜色的另一个示例程序。
<!DOCTYPE html> <html> <head> <title>How to link pages using absolute URL in HTML?</title> <style> a:link { text-decoration: none; } a:visited { text-decoration: none; } a:hover { text-decoration: underline; } a:active { text-decoration: underline; } </style> </head> <body> <h2>Click the link below to redirect to facebook login page</h2> <a href="https://#/login/">facebook login</a> </body> </html>
悬停在链接上后,它将更改样式。
广告
数据结构
网络
关系型数据库管理系统 (RDBMS)
操作系统
Java
iOS
HTML
CSS
Android
Python
C语言编程
C++
C#
MongoDB
MySQL
Javascript
PHP