Improving e-mail links

What is CSS Attribute Selector?
CCS allows us to stylize elements based on attribute references, and not on the type of the element itself. For example, you already know how to decorate the h1 header element:

h1 { color: blue; }

You can define the header attribute a bit more clearly:
')
h1[title] { color: blue; }

We can go even further:

h1[title="Go Home"] { color: blue; } /* "Go Home" */
h1[title~="Go Home"] { color: red; } /* "Go Home" - */
h1[title^="Go Home"] {color: green; } /* "Go Home" */

What is unique about soap links?
Now let's take the experience from the previous examples and build this:

a[href^="mailto"]:hover:after { content: attr(title); }

The header attribute we set to hover. This will work, but it may turn out that the text will appear immediately after the link. Therefore, correct the code for this:

a[href^="mailto"]:hover:after { content: " > " attr(title); }

What happened:

[ example ]

[*] it will be in place to clarify what is our favorite browser, - IE incorrectly displays the code, however, we are used to.