HTML
CSS
PHP
Deno
Examples
Do It Yourself
Blog
Type in your code below
Run
<!DOCTYPE html> <html><head> <style> /* unvisited link */ a:link { color: #000000; } /* visited link */ a:visited { color: #00FF00; } /* mouse over link */ a:hover { color: #0000FF; } /* selected link */ a:active { color: #666666; } </style> </head> <body> <div style="padding: 30px;"> <a href="#!" style="padding: 20px 10px;"> Hello World! </a> </div> <ul> <h2> Do you notice that:</h2> <li>When you haven't place an action it doesn't change it's color ( :link ).</li> <li> When you visited the element the color change to green (:visited ).</li> <li> When you hover the element the color change to blue( :hover ).</li> <li> When you click the element the color change to gray( :active ).</li> </ul> </body> </html>
Related Chapters
CSS Pseudo-Classes Selectors
CSS Positions
CSS Grouping
CSS Selectors
Related Examples
HTML CSS Tag Name Selector Description
CSS Pseudo Class :nth-child()
CSS Links pseudo last Child
CSS Selectors Grouping Intro
CSS Links Pseudo id