<ul>
    <li><a href="https://example.com">Link 1</a></li>
    <li><a href="http://example.com" title="Visit example.com">Link 2</a></li>
    <li><a href="/contact">Link 3</a></li>
    <li><a href="../contact/index.html">Link 4</a></li>
</ul>
    

ul {
  list-style: none;
  padding: 0;
}

ul li {
  margin: 0 0 7px 0;
}

a {
  display: block;
  border: 5px solid grey;
}

a[title] {
  border-color: pink;
}

a[href*="contact"] {
  border-color: orange;
}

a[href^="https"] {
  border-color: green;
}