When providing only a single image, rather than a set of images from which the browser
selects the best match for the viewport size and display pixel density, the
src attribute is a string specifying the URL of the
desired image. This can be set either within the HTML itself using the
src content attribute, or programmatically by setting the
If you use the
srcset content attribute to provide multiple
image options for different display pixel densities, the URL specified by the
src attribute is used in one of two ways:
- as a fallback for browsers that don't support
as an equivalent for specifying an image in
srcsetwith the size multiplier
1x; that is, the image specified by
srcis used on low-density screens (such as typical 72 DPI or 96 DPI displays).
Additionally, if you use
src along with both
sizes (or the
sizes content attribute) and
srcset in order to choose an image based on the viewport size, the
src attribute is only used as a fallback for browsers that don't support
srcset; otherwise, it's not used at all.
alt="Slices of grapefruit, looking yummy." />
When using a set of images with the
src serves as either a fallback for older browsers, or as the
1x size of the image.
When using viewport-bases selection of an image from a
srcset by also
sizes property, the
src property serves as the fallback to be used on browsers that don't
support viewport-based selection. Browsers that do support viewport-based
selection will ignore
src in this situation.
BCD tables only load in the browser