Shulou(Shulou.com)06/02 Report--

This article mainly introduces "what are the states of the css link style". In the daily operation, I believe that many people have doubts about the state of the css link style. The editor consulted all kinds of materials and sorted out simple and easy-to-use methods of operation. I hope it will be helpful to answer the questions of "what state does the css link style have?" Next, please follow the editor to study!

Set the style of the link, you can set a variety of CSS properties of the link style (for example, color,font-family,background, etc.). The particularity of links is that they can be styled according to the state they are in.

Four states of the css link style:

ALink-ordinary, unaccessed links

AVR visible-the link that the user has visited

A hover-the mouse pointer is over the link

The moment when the link is clicked

Case study

A:link {color:#FF0000;} / * unaccessed links * /

A:visited {color:#00FF00;} / * visited links * /

A:hover {color:#FF00FF;} / * move the mouse pointer over the link * /

A:active {color:#0000FF;} / * Link being clicked * /

Css Link style method

When styling different states of a link, follow the rules in the following order:

A:hover must be after a:link and a:visited

A:active must be after a:hover

Common link styles

In the above example, the link changes color according to its state.

Let's take a look at several other common ways to style links:

Text modification

The text-decoration attribute is mostly used to remove underscores from links:

Case study

A:link {text-decoration:none;}

A:visited {text-decoration:none;}

A:hover {text-decoration:underline;}

A:active {text-decoration:underline;}

Background color

The background-color attribute specifies the background color of the link:

Case study

A:link {background-color:#B2FF99;}

A:visited {background-color:#FFFF85;}

A:hover {background-color:#FF704D;}

A:active {background-color:#FF704D;}

At this point, the study on "what is the state of css link style" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.