source element | source object
The source element is used to specify alternative source sets for img elements.
DOM Information
Inheritance Hierarchy
Members
The source object has these types of members:
Properties
The source object has these properties.
| Property | Description |
|---|---|
|
A media query list to be used within a picture element. | |
|
Specifies how large an image will render within a layout. | |
|
Specifies a list of one or more possible images to display based on the pixel density of the user's display, or the viewport width. | |
|
Specifies the file type of the images in the source set. |
Standards information
Remarks
The source element is used only within the picture element, and the source element does not represent anything on its own.
The srcset attribute must be present.
If the media attribute is present, its value must be a valid media query list.
If the type attribute is not specified, the user agent will not select a different source element if it does not support the image format.
If a source element has a sibling source or img element with a srcset specified, a valid type and/or media attribute must be present.
Examples
This example shows a source element being used inside of a picture element to define an alternative source set.
<picture> <source media="(min-width: 600px)" srcset="large.png, large-double.png 2x"> <img src="fallback.png"> </picture>
See also