Saturday, August 24, 2013

How to add file size and extension name after links that go to PDF Files.

We can add " (PDF) " Text and file size after all links that go to PDFs, this will help users to know easily links that go to PDFs files.

 Here CSS Code snippet:

/* Add " (PDF)" text after links that go to PDFs */
a[href$=".pdf"]:after { content: " (PDF)"; }

/* If file size specified as data attribute, use that too */
a[href$=".pdf"][data-size]:after { content: " (PDF, " attr(data-size) ")"; }

Result Exemple :

Download here (PDF, 2MB)
Disqus Comments