Dynamic Pseudo Classes
Pseudo Classes allow the designer the freedom to control how the element should appear under different conditions. Using dynamic pseudo classes, it is possible to customize those styles. Pseudo class selectors start with a colon and are usually added immediately after a type selector with no additional whitespace.
:link - Adds style to an unvisited hyperlinks
:visited - Styles for links that have already been visited
:focus - Signifies an element that currently has focus
:active - Adds style to an activated link
:hover - Adds style to an element when you mouse over it
You can add calss names and customized various links
The following HTML page implement different pseudo-class-selectors to given link:
CSS pseudo-elements selectors enable you to assign properties to the areas of a document that are not delimited by standard elements.
The :first-line pseudo-element enables you to dynamically style the first line of text as displayed in the browser.
The above code style the first line of the paragraph with underline.
The :first-letter pseudo-element enables you to style the first letter of an element.
The above code style the first letter of the paragraph with decorated font style.
:before and :after
The :before and :after pseudo elements enable you to add additional text to the before or after to an element.
For the following example you can understand how to implement Pseudo Element Selectors