HTML and CSS Reference
In-Depth Information
::marker Pseudo-element
CSS3 added a handy pseudo-element to access the list marker, both
defining and providing a way to change the styles and positioning of the
marker that isn't available through shifting or padding on the list item
or wrapping the content of a list item in another element, allowing inde-
pendent control of properties such as color and font-size :
<li><span>list content</span></li>
Unfortunately, at the time of this writing, there isn't a browser that
supports ::marker . Combined with counters and generated content,
which are discussed in the next section, this will be a powerful way to
generate custom markers for content.
Generated Content
As is the case with list markers, it can sometimes be desirable to display
content that doesn't come from the HTML document. Generated content
is defined with the content property and then added to the document as
the content of the pseudo-elements ::before and ::after (and, eventu-
ally, ::marker ).
The content property allows for a number of different types of content
that may be added to the selected pseudo-element, including the
<string> : Text content for inserting into the element
<url> : A URI of an image
none : No content is defined
Search WWH ::

Custom Search