CSS pseudo-classes are used to add special effects to some selectors.
CSS pseudo classes can be used to add special effects to some selectors.
Hyperlink
How to add different colors to super connections in the document
This example demonstrates how to add different colors to a hyperlink in a document.
Examples instance:
The code is as follows: |
Copy code |
Source Code to Run [] A: link {color: # FF0000} A: visited {color: #00FF00} A: hover {color: # FF00FF} A: active {color: # 0000FF} This is a link Note: a: hover MUST come after a: link and a: visited in the CSS definition in order to be valid !! Note: a: active MUST come after a: hover in the CSS definition in order to be valid !!
|
[You can modify some code before running it to view the effect]
Hyperlink 2
How to add other styles to a super connection
This example demonstrates how to add other styles to hyperlinks.
Examples instance:
The code is as follows: |
Copy code |
A. one: link {color: # ff0000} A. one: visited {color: # 0000ff} A. one: hover {color: # ffcc00} A. two: link {color: # ff0000} A. two: visited {color: # 0000ff} A. two: hover {font-size: 150%} A. three: link {color: # ff0000} A. three: visited {color: # 0000ff} A. three: hover {background: #66ff66} A. four: link {color: # ff0000} A. four: visited {color: # 0000ff} A. four: hover {font-family: monospace} A. five: link {color: # ff0000; text-decoration: none} A. five: visited {color: # 0000ff; text-decoration: none} A. five: hover {text-decoration: underline} Mouse over the links to see them change layout. This link changes color This link changes font-size This link changes background-color This link changes font-family This link changes text-decoration
|