CSSImageValue
The CSSImageValue
interface of the CSS Typed Object Model API represents values for properties that take an image, for example background-image
, list-style-image
, or border-image-source
.
The CSSImageValue object represents an <image>
that involves a URL, such as url()
or image()
, but not linear-gradient()
or element()
.
Instance properties
None.
Instance methods
Inherits methods from CSSStyleValue
.
Examples
We create an element
html
<button>Magic Wand</button>
We add some CSS, including a background image requesting a binary file:
css
button {
display: inline-block;
min-height: 100px;
min-width: 100px;
background: no-repeat 5% center url(magicwand.png) aqua;
}
We get the element's style map. We then get() the background-image from the stylemap and stringify it:
js
// get the element
const button = document.querySelector("button");
// Retrieve all computed styles with computedStyleMap()
const allComputedStyles = button.computedStyleMap();
// Return the CSSImageValue Example
console.log(allComputedStyles.get("background-image"));
console.log(allComputedStyles.get("background-image").toString());
Specifications
Specification |
---|
CSS Typed OM Level 1 # imagevalue-objects |
Browser compatibility
BCD tables only load in the browser