The special effects that CSS produces

CSS often have friends ask: How to make a hyperlink text does not appear underline, how to make the mouse to move to the hyperlinks on the effect of discoloration? In fact, these traditional methods can not be done. The use of CSS control can be very easy to do, and the page code is not bloated.

★ First Look at the hyperlinks without underlining the example:

Example 1: This connection can go to the bottom of the page, but there is no underline.

How did this happen? In and between and plus the following CSS syntax control:

If you want to create a discoloration effect, you need to use another property, this is hover, look at the following code.

a:hover {Text-decoration:none Color:yellow} indicates that the text decoration style is "none" (that is, no underline) when the mouse is moved to the connected text, and yellow is displayed.

a:hover {Text-decoration:underline Color:green} indicates that the text decoration style is "underline" (that is, underlining) while the mouse is moving to the connected text, and green is displayed.

★ Extension: If we use the following 2 attributes at the same time, what effect will it have?

a:link {text-decoration:none; color:yelloe; font-size:9pt}

a:hover {text-decoration:underline; color:green; font-size:12pt}

The connection text is not underlined, the yellow display, the 9pt size. The mouse moves to the connection when the underline, the color is green, character size 12pt. Is it discolored? and the font due to the size of the change, there is a dynamic, it seems to expand all of a sudden.

In a word, all the methods mentioned above should be used synthetically.

★ Note: Not all of the browsers support all the option attributes. Test yourself on multiple browsers.