Trick to hide email address smartly on a webpage to stop spam

Protecting emails from spamming is a tough task. Scraping email data is usually a great trick to get huge lists of working emails from a search engine, but how do we stop it?
Here is one of the ways to hide your email address from being scraped.

CSS

mail::after{content:attr(dom)}
mail::before{content:attr(me) "\0040"}

HTML

<mail me="my_safe_email" dom="gmail.com"></mail>

so final code will look like:

<style>
mail::after{content:attr(dom)}
mail::before{content:attr(me) "\0040"}
</style>
<mail me="myemail" dom="gmail.com"></mail>

See it in action