Try it Yourself: CSS Pseudo-classes

CSS Pseudo-classes

<!DOCTYPE html>
<html>
<head>
<style>
.btn {
  background: #00643c;
  color: #fff;
}

.btn:hover {
  background: #00502f;
}

.btn:focus {
  outline: 2px solid #00643c;
}
</style>
</head>
<body>

<button class="btn">Submit</button>

</body>
</html>

<!DOCTYPE html>
<html>
<head>
<style>
.btn {
  background: #00643c;
  color: #fff;
}

.btn:hover {
  background: #00502f;
}

.btn:focus {
  outline: 2px solid #00643c;
}
</style>
</head>
<body>

<button class="btn">Submit</button>

</body>
</html>