How to add :hover on ::before and ::after css selector

Some people find and facing the problem of how to use hover effect on ::before and ::after css selector, but it can be done by simple css code. Below I show how to add hover css on changing before and after selector. Some time :before and :after css selectors are used for add content, image, etc before and after an element.

Do  like

Code for doing the above example