Here’s a CSS effect to add a rubber stamp type marker over existing content.
It uses the pseudo element :after to add the text content to an element with the appropriate class, in this case, .sample.
A few little points to note:
- The :after style’s z-index must be higher than the existing content so that it appears on top of it.
- The position of the content needs to set with top: and left:. With the transform:rotate this may take a bit of trial and error to get right.
- In IE8 or below the transform:rotate won’t work so the text will just appear horizontally. Keep this in mind when setting the position.
- text-shadow: and box-shadow: might not work in all browsers but it still looks ok without these enhancements