[CSS] Pseudo-classes, Let’s Make Nice Button!
Pseudo classes are used to define a something special state of our html elements, for example, when you click on it, visited or link to go the other page through the elements, and etc...
Pseudo classes .classname:pseudo classes
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | .btn:link, .btn:visited { text-transform: uppercase; text-decoration: none; padding: 15px 40px; display: inline-block; border-radius: 100px; transition: all .2s ; } .btn:hover { transform: translateY(-3px); box-shadow: 0 10px 20px rgba(0,0,0,.2); } .btn:active { transform: translateY(-1px); box-shadow: 0 5px 10px rgba(0,0,0,.2); } .btn-white { background-color: #ffffff; color: #777; } | cs |
As you can see the script, there are 4 pseudo classes are used in there. :link and visited are opposite pseudo classes. when the the element is unvisited or visited, both pseudo classes selects the elements(a tag has class name "btn") and applies below properties.
If you really wanna know more pseudo classes, Please go to the site you can see a lot of pseudo classes are there.
Korean 
English