Lesson: 15 | Link Colors

Notes
Video

Notes

By default, a link will appear like this (in all browsers):

An unvisited link is underlined and blue
A visited link is underlined and purple
An active link is underlined and red

<style>
a:link {
  color: green;
  text-decoration: none;
}
</style>

<a href="https://facebook.com" target="_blank">Facebook</a>

<style>
a:visited {
  color: orange;
  text-decoration: none;
}
</style>

<a href="https://facebook.com" target="_blank">Facebook</a>

<style>
a:active {
  color: green;
  text-decoration: none;
}
</style>

<a href="https://facebook.com" target="_blank">Facebook</a>

A link can also be styled as a button, by using CSS:

<style>
a:link {
  background-color: #f44336;
  color: white;
  padding: 15px 25px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  color:yellow;
  font-weight:bold;
}

a:hover {
  background-color: green;  
  font-weight:bold;
  color:white;
  border: 2px solid black;
}
</style>


<a href="/~vtqkyvmy/facebook.com" target="_blank">This is a link</a>

Prev You need to login to have access to the quizzes. Next

Mastered by 50 users.

Lightning Web Components

A. Component Reference (27 lessons)

B. Lightning Web Components | Utilities (11 lessons)

C. Lightning Web Component Guide (41 lessons)

D. Java Script Methods for LWC (23 lessons)

E. HTML (18 lessons)

F. JavaScript (19 lessons)

Go to top

Login to your account

Lesson: 15 | Link Colors

Notes

Lightning Web Components