<div class="wrap">
  <div class="container">
    <div>
      <a href="http://somelocation.com/file.doc">Scarica il documento in formato <code>.doc</code></a>
    </div>
    
    <div>
      <a href="http://somelocation.com/file.pdf">Scarica il documento in formato <code>.pdf</code></a>
    </div>
    
    <div>
      <a href="http://somelocation.com/file.xls">Scarica il documento in formato <code>.xls</code></a>
    </div>
    
    <div>
      <a href="http://somelocation.com/file.png">Scarica il documento in formato <code>.png</code></a>
    </div>
  </div>
</div>
/* Stili per l'esempio */
[href$=".doc"]::after{
content: " " url("https://cdn3.iconfinder.com/data/icons/document-icons-2/30/647719-word-20.png");
}

[href$=".pdf"]::after{
content: " " url("https://cdn3.iconfinder.com/data/icons/document-icons-2/30/647716-pdf-20.png");
}

[href$=".xls"]::after{
content: " " url("https://cdn3.iconfinder.com/data/icons/document-icons-2/30/647714-excel-20.png");
}

[href$=".png"]::after{
content: " " url("https://cdn3.iconfinder.com/data/icons/document-icons-2/30/647715-image-20.png");
}

/* Stili generali */
html, body{
  font-family: 'Open Sans', sans-serif;
  font-size: 20px;
  margin: 0;
  padding: 0;
}

.wrap{
  margin: 30px;
}
Run Pen

External CSS

  1. https://fonts.googleapis.com/css?family=Open+Sans

External JavaScript

This Pen doesn't use any external JavaScript resources.