CSS property: icon


The icon property provides the author the ability to style any arbitrary element with an iconic equivalent.

An element's icon is not used/rendered unless the content property is set to the value icon. Documents whose elements have icons assigned to them can be more easily viewed by users who find too much text distracting.


icon: auto | <uri> [, <uri>]*;


auto (by default)

Use a default generic icon provided by the user agent.


URIs provide a way of identifying resources. The value(s) in this property refer to one or more icons in a comma delimited list. The user agent loads the referenced icons one by one until it finds one that it is able to render. This permits the usage of multiple different icon formats for various platforms, and various media for that matter.



 * note that the CSS3 Generated Content module
 * expands the content property to apply to all elements.
img, object {
    content: icon;

/* provide a custom icon for images */
img {
    icon :url(imgicon.png);

/* provide a different custom icon for objects */
object {
    icon: url(objicon.png);