- February 8, 2017
- Posted by: user
- Category: Uncategorized
The :before pseudo-element is used to insert content immediately before an element. This is done via the content property. The content assigned by the content property can be characters, a string, text, or an image. Further, you can apply style to the content, such as setting font and color. This is a convenient way to prefix the same text to large number of related text elements which have the same class value.
The similar :after pseudo-element is used to insert content immediately after an element.
CSS2 has four pseudo-elements: :after, :before, :first-letter, and :first-line. Pseudo-elements allow you to create element-like structures which permit you to apply style to parts of a document that normally cannot be accessed using HTML. Specifically, you can add styled content before and after an element, or effect the style of the first letter or first line of an element.
style code
body{font:normal 12px arial;}
p.orange:before {content: "ABOUT iSUMMATION"; color: orange;font:bold 12px arial;}
p.orange:after {content: "India"; color: blue;font:bold 12px arial;}