How to use css to change the font color when the mouse moves over it? (Code actual test)-CSS Tutorial-php.cn

How to use css to change the font color when the mouse moves over it? (Code actual test)

藏色散人

Release： 2018-08-09 15:22:20

Original

15638 people have browsed it

When we browse a web page, a discoloration effect will appear when the mouse passes over a certain text. This is the css font discoloration. On the one hand, it is to actively attract the user's attention to click, and on the other hand, it is to prevent the user from clicking on the wrong text. paragraph. In fact, this CSS mouse font color changing effect is very easy to achieve. As long as you have a little knowledge of css, you can operate it.

The main knowledge point is that the mouse hover is written as HOVER in CSS, and the mouse trigger is written as ACTIVE in CSS.

The specific code example for realizing the font color changing effect of css mouse is as follows:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>css字体变色测试</title>
</head>
<style>
    a {
        color:black}
    a:hover {
        color:red }
    a:active {
        color:blue}
</style>
<body>
<a>
    你过来指我试试！！！
</a>
</body>
</html>

Copy after login

The above code can be directly copied and tested locally.

How to use css to change the font color when the mouse moves over it? (Code actual test)

Note: The color: red after a means that the link text is black, and the color: black of a:hover means that the link text is red after the mouse moves over it, a :active's color:blue; equals to blue when the mouse clicks on the link text.

So I hope this article will be helpful to everyone on how to achieve the font discoloration effect of the CSS mouse!

[Related content recommendations]

Detailed explanation of text font color (CSS color) in CSS

Font color in html and css Relevant summary of settings

Settings of font color and background color

Examples of how CSS implements text color gradient

The above is the detailed content of How to use css to change the font color when the mouse moves over it? (Code actual test). For more information, please follow other related articles on the PHP Chinese website!