HTML
CSS
PHP
Deno
Examples
Do It Yourself
Blog
Type in your code below
Run
<!DOCTYPE html> <html><head> <style> a{ border: solid #000000; padding:10px; display:block; margin:10px 0; } a#services:hover{ border-color: #ff0000; color: #ff0000; } </style> </head> <body> <div style="padding: 30px;"> <a href="#!"> Over Me (i don't have an id="services") </a> <a href="#!" id="services"> Over Me (i have an id="services") </a> <a href="#!"> Over Me (i don't have an id="services") </a> </div> <ul> <h2>NOTE:</h2> <li>When you over the element with no id="services", the element does not change while the element with id="services" changed the border to RED and color to RED.</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 Class