<body>
  <div id=”main”>
     <a href=”#”>Inner Link 1</a>
     <a href=”#”>Inner Link 2</a>
     <ul>
       <a href=”#”>Inner Inner Link 1</a>
       <li><a href=”#”>List Item 1</a></li>
       <li><a href=”#”>List Item 2</a></li>
     </ul>
     <a href=”#”>Inner Link 3</a>
  </div>
  <a href=”#”>Outer Link 1</a>
  <a href=”#”>Outer Link 2</a>
</body>
html,body {
  padding: 50px;
  font-family: sans-serif;
  font-size: 1.2em;
}

/* Captain obvious says you can uncomment the declartion you'd like to see applied */

a:only-of-type {
  border: 2px black solid;
}

/*
a:first-of-type {
  border: 2px black solid;
}
*/

/*
a:last-of-type {
  border: 2px black solid;
}
/*

/*
a:nth-of-type(1) { 
  border: 2px solid black;
}
*/

/*
a:nth-of-type(0) { 
  border: 2px solid black;
}
*/

/*
a:nth-of-type(2) { 
  border: 2px solid black;
}
*/

/*
a:nth-of-type(3) { 
  border: 2px solid black;
}
*/

/*
a:nth-of-type(n) {  
  border: 2px solid black; 
}
*/

/*
a:nth-of-type(2n + 1) {  
  border: 2px solid black; 
}
*/

/*
a:nth-last-of-type(1) {  
  border: 2px solid black; 
}
*/

/*
a:only-child { 
  border: 2px solid black;
}
*/

/*
a:first-child { 
  border: 2px solid black;
}
*/

/*
a:nth-child(1) {  
  border: 2px solid black; 
}
*/

/*
a:nth-child(2n - 1) {  
  border: 2px solid black; 
}
*/

/*
a:nth-last-child(1) {  
  border: 2px solid black; 
}
*/
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.