<div class="outer">
  <a href="#">リンク</a>
</div>
.outer {
  text-align: center;
  margin: 20px;
}
a, a:visited {
  /* 通常のリンクとリンク先を閲覧済みのとき */
  color: #00bcd4;
  text-decoration: none;
}
a:hover {
  /* カーソルをリンクに当てたとき */
  color: #e91e63;
  text-decoration: underline;
}
a:active {
  /* リンクをクリックしたとき */
  color: #9c27b0;
  text-decoration: none;
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.