Grow your CSS skills. Land your dream job.

Last updated on:

Print URL After Links

@media print{
       a:after{content:" (" attr(href) ") ";font-size:0.8em;font-weight:normal;}
}

Comments

  1. Simply amazing. A great tut would be all about Print stylesheets! Thanks Chris!

  2. A demo would have been a lot much handy here !

  3. Permalink to comment#

    Demo can be found here:
    http://jsfiddle.net/duemF/

    It’s also possible to turn the link black by adding color: #000, but text-decoration: none; doesn’t seem to work.

  4. Thomas

    If you’re curious about browser support see the CSS tricks entries for
    Pseudo elements (:after)
    and
    CSS content property

  5. Joobleblob

    Don’t suppose anyone knows a nice method of doing this but excluding > “mailto:” from select links?

Leave a Comment

Posting Code

  • Use Markdown, and it will escape the code for you, like `<div class="cool">`.
  • Use triple-backticks for blocks of code.
    ``` 
    <div>
      <h1>multi-line block of code</h1>
      <span>be cool yo.</span>
    </div>
    ```
  • Otherwise, escape your code, like <code>&lt;div class="cool"&gt;</code>. Markdown is just easier though.

Current ye@r *

*May or may not contain any actual "CSS" or "Tricks".