This article focuses on the HTML a tag that lets the mouse hover over color, as well as other styles of CSS that control mouse hover. There is a detailed example of the tutorial, you can let everyone learn faster, then let us look at this article together
First, let's look at the a tag in HTML when the mouse hovers over the color:
Everyone should know the CSS property of the A tag mouse hover in HTML, yes, that's what we're talking about today.
: hover: This was said in the previous CSS style with a tag. This mouse hover features a lot of, today we would like to say in HTML a tag hover color. This should be used by everyone.
Let's take a look at an example of the complete code:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>PHP Chinese Network</title>
<style>
.link_1:hover{color:pink;}
</style>
</head>
<body>
<a href="#" class="link_1">Here is the PHP Chinese network</a>
</body>
</html>
This is a basic code that defines the name of a link_1. The effect is that when the mouse hangs over the text, the text will change color.
After talking about the effect of mouse hover color change, now we should talk about the three effects of mouse hover, let's look at it together:
:hover{font-size:60px;}The mouse moves up and becomes bigger
:hover{text-decoration:underline;}The underline appears on the mouse
:hover{background:#ccc;} Mouse over to change the background color (: {background:#ccc;} link appears background color)
As mentioned above, we can do a lot of things in the mouse hover, we will show them together now, (I want to learn more about the css style related knowledge to the PHP Chinese website css study manual section) Now let us Look at the code and effects.
Html a tag css control style complete code:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>PHP Chinese network</title>
<style>
.link_1:hover{color:pink;}
.link_2:hover{font-size:60px;}
.link_3:hover{background:red;}
</style>
</head>
<body>
<a href="#" class="link_1">Here is the PHP Chinese network</a>
<a href="#" class="link_2">Here is the PHP Chinese network</a>
<a href="#" class="link_3">This is PHP Chinese Network</a>
</body>
</html>
As above, we set up three css style code, the first one is color change, the second one is bigger, and the third one is background change.