Home > Article > Web Front-end > How to use css hover
css hover usage
CSS :hover selector definition and usage
:hover selector is used to select the element on which the mouse pointer is floating.
Tip: The :hover selector can be used on all elements, not just links.
Tip: The :link selector sets the style of links pointing to pages that have not been visited, the :visited selector is used to set links to pages that have been visited, and the :active selector is used for active links.
Recommended learning: CSS tutorial
Note: In the CSS definition, :hover must be located after :link and :visited (if present), so that the style can take effect .
Example:
Select the element on which the mouse pointer is floating and set its style:
<!DOCTYPE html> <html> <head> <style> a:hover { background-color:yellow; } </style> </head> <body> <a href="http://www.php.cn">PHP</a> <a href="http://www.google.com">Google</a> <a href="http://www.wikipedia.org">Wikipedia</a> <p><b>注释:</b>:hover 选择器鼠标指针在其上浮动的链接设置样式。</p> </body> </html>
Effect:
Note: All major browsers support the :hover selector.
The above is the detailed content of How to use css hover. For more information, please follow other related articles on the PHP Chinese website!