Pseudo-class is a colon, the colon is two pseudo-elements
Pseudo-classes may be independent element of the document for distribution pattern, and may be assigned to any element, the logic and functionality on a class similar to, but which is predefined, does not exist in the document tree and expressed in different ways, so called pseudo-classes .
The pseudo-element content control and content control as an element, but pseudo-elements do not exist in the document tree, not the real elements, so called pseudo-elements.
There pseudo-classes :: first-child,: link: , vistited,: hover:, active: focus,: lang
pseudo-element has :: first-line,: first- letter,: before,: after
Reminder, if your site only needs to be compatible webkit, firefox, opera and other browsers, we recommend that the wording for the pseudo-element double colon, if you have to be compatible IE browser, or use a single colon CSS2 wording safer
Pseudo-classes and pseudo-element differences:
Pseudo-classes
Pseudo-class is selected based on the element is an element of the current state, or the current element with the characteristics, rather than static flag element id, class, properties and the like. Due to dynamic changes state, so to achieve a particular state of an element, it is possible to obtain a pseudo-style class; when state changes, it will lose this style. It can be seen, and its function is somewhat similar class, but it is based on abstract outside of the document, so called pseudo-classes.
:link
Pseudo-class will be applied to the link has not been visited, and: visited are mutually exclusive.
:hover
The pseudo-class element has applied the mouse cursor over it.
:active
Pseudo-class will be applied to the active element, such as a link is clicked, the pressed button or the like.
:visited
The pseudo-class applies to links have been visited, and: link mutually exclusive.
:focus
Pseudo-class element has to be applied to the keyboard input focus.
:first-child
Pseudo-class will be applied to the elements when the page first appears.
: just
The pseudo-class applied to the case of the element with the specified lang.
Pseudo-element
For the dummy earth element is different from the special state, the pseudo-element is a specific content element operates, it operates on a deeper level than the pseudo-type layer, and thus its dynamic properties are much lower than for a pseudo-classes . In fact, the dummy element is designed to select the first word to the contents of such element (female), a first row select specific content such a conventional front or rear selector could not be done. It's actually control the content and elements are the same, but it itself is only based on abstract elements do not exist in the document, so called pseudo-elements.
::first-letter
Style pseudo-element is applied to the first word of the text element (parent).
::first-line
Style pseudo-element is applied to the first line of text elements.
::before
Adding new content on top of element content.
::after
Adding new content in the rearmost element content.