This shows you the differences between two versions of the page.
Both sides previous revisionPrevious revision | |||
ideas:pseudo-elements [2014/12/09 15:48] – external edit 127.0.0.1 | ideas:pseudo-elements [2017/01/27 12:16] (current) – bkemper | ||
---|---|---|---|
Line 95: | Line 95: | ||
<!-- ::before pseudo-element 2 --> | <!-- ::before pseudo-element 2 --> | ||
markup content | markup content | ||
+ | </ | ||
+ | </ | ||
+ | |||
+ | <code css> | ||
+ | div::before {border: thick solid green; content=" | ||
+ | div:: | ||
+ | div::after {border: thick solid green; content=" | ||
+ | div:: | ||
+ | </ | ||
+ | <code html> | ||
+ | <div> | ||
+ | <!-- ::before pseudo-element --> | ||
+ | <!-- nesting ::before pseudo-element --> | ||
+ | text2 | ||
+ | <!-- end --> | ||
+ | text1 | ||
+ | <!-- end --> | ||
+ | markup content | ||
+ | <!-- ::after pseudo-element --> | ||
+ | text3 | ||
+ | <!-- nesting ::after pseudo-element --> | ||
+ | text4 | ||
+ | <!-- end --> | ||
+ | <!-- end --> | ||
</ | </ | ||
</ | </ |